Media Query Won't Effect Font Size
Permalink
Hello,
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
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
MrKDilkington,
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?
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?
@ramdettmer
You will need to create a more "specific" style.
You will need to create a more "specific" style.
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:
https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity...
https://css-tricks.com/specifics-on-css-specificity/...