+ 4
Yes you can make a site fully responsive without media queries. I'll list a few techniques. - Use JavaScript libraries like responsive.js. That library is intended to only do things that CSS can't but that's up to you. responsive.js can be told not to indirectly use media queries as shown in this example: http://www.responsivejs.com/demo/example.html - Without a library, you can also write your own JavaScript to make things responsive too. You could listen for the window's resize event and respond by translating width-ranges to classes like 'wide', 'medium', 'small'... on the body element or something high in the dom that are easy for CSS to query for. In your CSS, you can then do something like: body.medium { .my-component { font-size: 10px; }} I always use media queries for that but actually did something like this for resizable widgets in a page since media queries were too limited to find width of a specific element. - Use other libraries that already implement the media queries. I'm mentioning this because it means you're not technically "writing CSS media query" when someone else wrote it. Some examples of this would be using Bootstrap's CSS library for its responsive grid system. Here are some more weakly related points to your question: - Use viewport-related units like vmin, vmax, vh, vw, and sometimes %. This alone can't make a web layout fully responsive but it often helps. - IE conditional comments. For example, <!--[if lt IE 7]> <html class="ie ie6 lte9 lte8 lte7"> <![endif]--> <!--[if IE 7]> <html class="ie ie7 lte9 lte8 lte7"> <![endif]--> <!--[if IE 8]> <html class="ie ie8 lte9 lte8"> <![endif]--> <!--[if IE 9]> <html class="ie ie9 lte9"> <![endif]--> <!--[if gt IE 9]> <html> <![endif]--> <!--[if !IE]><!--> <html> <!--<![endif]--> - This won't help with responsiveness to resolution but you can use the media attribute on the link element to use CSS only when it is for print or screen media. https://www.w3schools.com/tags/att_link_media.asp
30th Jun 2019, 4:18 AM
Josh Greig
Josh Greig - avatar
+ 3
The answer is no, unless your website is so simple that its layout can fit all the screen sizes. You should use media query, this is why css needs media query to handle design of different screen sizes.
30th Jun 2019, 3:56 AM
CalviŐ˛
CalviŐ˛ - avatar
0
Use Bootstrap
30th Jun 2019, 6:11 AM
Frenchtoast
Frenchtoast - avatar