Media Query Won't Effect Font Size


Having problems with font sizing when scaling down the window. If i do for example
@media screen and (max-width: 600px){
h1 {
font-size: 16px;

This doesn't effect anything onto my site. Any ideas as to why it won't take? Getting frustrated with it.

Thank you

View Replies: View Best Answer
MrKDilkington replied on at Permalink Best Answer Reply
Hi ramdettmer,

There are probably other styles with a greater selector specificity that target h1 in your theme. This will prevent your style from taking effect.

More information on selector specificity:
ramdettmer replied on at Permalink Reply

Thanks for all the help. I did include a h2 editing in the customization where clients can change the size, weight, font family, and letter spacing in the design/customization panel for the different headings (h1-h6).
In that case, is there a way to have a media query override that when the screen scales down?
MrKDilkington replied on at Permalink Reply

You will need to create a more "specific" style.