0
Hello, I would like to know why some commands that belong to a @media are influencing and changing the same command in a @media different. For example, when I put a "width: 30%" in some photo on @media (min-width: 1200px), it changes the size of that same photo also on @media (min-width: 1500px). I found that in some cases, the problem is solved if I put a !important in the element of @media affected, but this does not always resolve. I am organizing the CSS as follows:
- Desktops-1 (min-width: 1500px);
- Desktops-2 (min-width: 1200px); and
- Tablets-1 (min-width: 1000px).
I intend to continue putting more specific resolutions to hold, but this bug is in the way.
It will depend on the selectors you use and the order you apply, without seeing your CSS and the selectors you are using we have no way to respond, you should provide a READY example that we can test so we can help you.
– Guilherme Nascimento
Your problem is explained in this answer https://answall.com/questions/351972/media-queries-n%C3%A3o-funciona-medidas-informadas/351977#351977 in your CSS sheet should first come the 1000px, then the styles of the 1200 and at the end of the 1500 and so on, the link has more details
– hugocsl
@hugocsl can also be, or it can be only the order or priority of selectors, there is no way to state anything, there is no code in the question.
– Guilherme Nascimento