Media query help!

HTML-CSS
#1

Hey there!

I am working on my technical documentation project, overall I am happy with my outcome, but I am having a more difficult time getting the media query to respond how I want it to. The first problem I want to address is getting the main-doc underneath and left page aligned. Looking further down the page I can see a problem with my color boxes as well. I will attach my codepen,

Thank you for any help!

https://codepen.io/TashaTheUnicorn/pen/jOVPNom?editors=1100

#2

The max-width media query should be below the styles it is changing, not above.

The styles inside the media query will overwrite other styles, but for that to work, it has to be correctly placed in the cascade (the order of CSS applied).

1 Like
#3

Thank you! I had forgotten about the cascade order nuance.