Questions tagged [Media queries] (79)

Hello. I decided to make a web page that would appear on the computer, iPad and smartphone in a readable form, but there it was. The problem that confused me is the following: in css file I defined a property external diva max-width: 980px; height: 100%; on the screen, this div is no more than 980 pixels, if the window is s...

Hello! Recently versed with responsive design, practiced on a simple website, did media queries for old/new iPhone and iPad. Checked layout through emulators of these devices in Mac OS X, and on a physical iPad. There, everything looked as it should, but I decided to check on the websites that show your layout on different...

For some reason in Chrome not working width alignment of list items when placed in a CSS media query. Try to reduce the size of the window with the result in fiddle. jsfiddle.net/B8fnF

Welcome. For example there is a layout with these dimensions:max-width: 1400px; min-width: 1000px; width: 100%; I need to layout not collapsing under 1366 width => 1280 => 1024 Write media query: only screen and (max-width : 1366px) {.....} only screen and (max-width : 1280px) {.....} only screen and (max-width : 1...

Can I do less here@gap: 30px; @media only screen and (max-width: 1440px) { @gap: 40px; } Naturally, it doesn't work, but maybe I something wrong doing?

Friends, Hello! Here is the style that will be applied to the object if the width of the window between 700 and 1000 pixels.@media (max-width: 1000px) and (min-width: 700px) { .selector1 { color: #000; } } But I want this style applied to the object with the class selector1 even in that case, if any parent object has a cl...

What is the difference between this announcement: (max-width: 768px) { .content { width: 500px; } } and this: screen and (max-width: 768px) { .content { width: 500px; } }

Please correct. Create a responsive design for your website. Built this CSS: all and (max-width: 320px){ } all and (max-width: 480px){ } all and (max-width: 768px){ } all and (max-width: 992px){ } all and (max-width: 1200px){ } all and (max-width: 1600px){ } How convenient or correct to impose - minimum screen resolut...

Hello! Tell me if my layout is focused only on changing the width of the device, how should look like media queries? The thing is, I tested one page on special sites, but the actual devices on hand was only the monitor and the tablet is 8", all worked as it should, but the person with the iphone said that it will not be sw...

Hello. I'm interested in the last two cards in the adaptive example, as would be more correct to change them width? Until I see the options: 1. Ask the last two cards pre-prepared classes and these classes need to register in media queries. 2. :nth-child What are the options?