Ne Kr Ne Kr - 1 year ago 117
CSS Question

Media query is not called

Can anyone see why this media query does not work? The first part of the CSS .header-x1 is working fine. But I would like to change font size when the max width is 768px. But nothing happens when I run my code here. Can anybody see why?

<p class="header-xl">
This is a test

.header-xl {
font-weight: 900;
font-size: 5em;
line-height: 1;
text-transform: uppercase;
color: #fff;
padding-top: 160px;

@media(max-width:768px) {
header-xl {
font-size: 8px;

Answer Source

You are missing a . for the class in media query, Instead of header-xl add .header-xl

@media(max-width:768px) {
    .header-xl  {
        font-size: 8px;
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download