Media Queries in CSS ? | Sololearn: Learn to code for FREE!

+5

Media Queries in CSS ?

Can anyone tell me the devices width used for media queries in CSS. I am really confused and i cant understand Media Queries width for different devices.

7/8/2020 11:39:52 PM

J.K.A

4 Answers

New Answer

+1

LIFE DO GIVE SECOND CHANCE :) If you have a pc/laptop, you can get the typical devices viewport dimensions by going to the dev tools in any web browser(Chrome and Firefox recommended). Or there are some online resources out there: 1. https://www.icwebdesign.co.uk/common-viewport-sizes 2. https://docs.adobe.com/content/help/en/target/using/experiences/vec/mobile-viewports.html (This one is overkill..!) 3. http://viewportsizes.mattstow.com

0

Well thats a good question. But i dont know the answer

0

hi LIFE DO GIVE SECOND CHANCE :) you can use bootstrap width breakpoint refference for media querry. although you don't use bootstrap. // Extra small devices (portrait phones, less than 576px) @media (max-width: 576px) { ... } // Small devices (landscape phones, 576px and up) @media (min-width: 567px) and (max-width: 767px) { ... } // Medium devices (tablets, 768px and up) @media (min-width: 768px) and (max-width: 991px) { ... } // Large devices (desktops, 992px and up) @media (min-width: 992px) and (max-width: 1199px) { ... } // Extra large devices (large desktops, 1200px and up) @media (min-width: 1200px) { ... }

-1

Hope someone answer this question