Salman
Salman

Reputation: 1024

Second media query not working

The media query for the phone isn't working. I've looked at other posts and have found no solution.

As said above the problem is pretty plain. The media query for the laptop works, but for the phone does not seem to get recognized. Website: www,beesandthebirds.com

/*Media queries*/

/*Phone*/
@media only screen and (max-width: 415px) {
    #logo{
        background-size: 76%;
        height:60%;
    }
    #text{
        top:49%;
    }
    #text >h1{
        font-size: 4.5em;
    }
    #space{
        bottom: -47px;
    }
    .x8{
        top:625px;
    }
    .x9{
        top:725px;
    }
    .x10{
        top:825px;
    }
}

/*Laptop*/

@media only screen and (min-width:1024px) and (max-width: 1367px) {
    #logo{
        background-size: 21%;
        height:60%;
    }

    #text{
        top:49%;

    }
    #text >h1{
        font-size: 1.5em;
    }
    #space{
        bottom: -47px;
    }


}

Upvotes: 0

Views: 1431

Answers (1)

Salman
Salman

Reputation: 1024

I just recently added "meta name="viewport" content="width=device-width,initial-scale=1.0"" and now it works.

Upvotes: 1

Related Questions