Top "Media-queries" questions

Media queries enable the conditional application of CSS styles based on media types, such as screen and print, and the conditions of media features, such as viewport and device height and width.

How to detect the device orientation using CSS media queries?

In JavaScript the orientation mode can be detected using: if (window.innerHeight > window.innerWidth) { portrait = true; } else { portrait = false; } …

browser css tablet media-queries
Detect if a browser in a mobile device (iOS/Android phone/tablet) is used

Is there a way to detect if a handheld browser is used (iOS/Android phone/tablet)? I tried this with …

css media-queries
CSS media query to target iPad and iPad only?

Hi I am working with multiple tablet devices, iPad, Galaxy Tab, Acer Iconia, LG 3D Pad and so on. iPad …

ipad css webkit media-queries
How to make responsive table

I have a table to represent some data in my html page. I'm trying to make this table as responsive. …

css html responsive-design media-queries
How can I detect Internet Explorer (IE) and Microsoft Edge using JavaScript?

I've looked around a lot, and I understand that there's a lot of ways to detect internet explorer. My problem …

javascript html internet-explorer media-queries microsoft-edge
CSS media query to target only iOS devices

Is there a @media query to target only devices running iOS? For example: @media (min-device-width:320px) and (max-device-width:768px) { #nav { …

css media-queries
How to set portrait and landscape media queries in css?

Here is my media query: @media screen and (min-device-width: 768px) and (max-device-width: 1824px) and (orientation : portrait){ .hidden-desktop { display: inherit !important; } .…

html css media-queries
iPhone X / 8 / 8 Plus CSS media queries

What are the CSS media queries corresponding to Apple's new devices ? I need to set the body's background-color to change …

css media-queries iphone-x iphone-8 iphone-8-plus
What is the difference between max-device-width and max-width for mobile web?

I need to develop some html pages for iphone/android phones, but what is the difference between max-device-width and max-width? …

css mobile-website media-queries
Responsive css styles on mobile devices ONLY

I'm trying to make my responsive CSS styles work only on tablets and smartphones. Basically I have a style for …

css responsive-design media-queries