How do the media queries?

@media(max-width: 426px){
#halat-calc .form>div {
width: 100% !important;
display: block !important;;
float: none !important;;
}
}

Width 425 is not applicable
April 7th 20 at 15:51
4 answers
April 7th 20 at 15:53
Solution
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0 minimal-ui">
emmmm didn't know thank you. - claudie75 commented on April 7th 20 at 15:56
April 7th 20 at 15:55
@media(max-width: 426px) {
 #halat-calc .form > div {
 width: 100% !important;
 display: block !important;
 float: none !important;
}
}
not working. - claudie75 commented on April 7th 20 at 15:58
April 7th 20 at 15:57
And you are correct in the html written?
Know how to work the selector ">"?

Here's an example jsfiddle gash where everything works.


And to answer your question, understand media queries specified min and max width and depending on these parameters, it is possible for different screens to display different styles. So they work if just...

PS
Here the wide screen
ad059-clip-5kb.png?nocache=1
That's less 426px
ab3d0-clip-5kb.png?nocache=1
Yes, I know. All right
Here is one style
#halat-calc .form>div {
 width: 48%;
 display: inline-block;
 float: left;
 padding-right: 11px;
}

And here it is in console
5e4cf9a1cd0b5092230315.jpeg
Here is the second style
5e4cf9e60de45597504443.png
And as you can see it's not working - claudie75 commented on April 7th 20 at 16:00
Disassemble the game code, I will not, is not terribly convenient.
Most likely the problem is somewhere intersect with other styles, or something not properly connected. In short to make the fortune-teller makes no sense, we need to understand the layout.

Why am I all that? What if, in my example they are working, it means that the code compiled correctly and the error somewhere has crept in you. - Destinee_Grimes55 commented on April 7th 20 at 16:03
April 7th 20 at 15:59
#halat-calc .form > div

Very bad practice to write these selectors:
1) Use id styles are best only if the bloc no longer have any classes, if you have access to the HTML it is always better to add your class. But ID better leave for use in JS.
2) > div do you need to make thus tag? Perhaps better class to assign? Read about the methodology, type BEM and others.
3) a Long chain of nested sektorov. If so to write all CSS on the website in the future with the increase of pages on the site it is fraught with the increase of overlapping styles and a bunch of problems with fiddling styles on different pages. Time to support such styles increases many fold. And most importantly, changing one style you can never be sure that nothing else will break on another page where he can apply. Again, read about the methodology of layout.

Find more questions by tags CSS