Why media queries doesn't apply

Question

I read all @media topics on this site and it seems that code should working

body
{
    background-color: yellow;
}

@media screen and (min-width: 1080px;) and (max-width: 2000px;)
{
    body
    {
        background-color: green;
    }
}

@media screen and (max-width: 1079px;)
{
 body
    {
        background-color: red;
    }
}

i have viewport tag, but still background is always yellow... What's the problem?

Answer 1

here just take out the ;

body
{
    background-color: yellow;
}

@media screen and (min-width: 1080px) and (max-width: 2000px)
{
    body
    {
        background-color: green;
    }
}

@media screen and (max-width: 1079px)
{
 body
    {
        background-color: red;
    }
}

link to code example