Using media queries

[paaljoachim]

Hey Ari

I am recreating this site: http://maguti.com/ and have a development site here: https://fragmentsofawalk.com/

Almost everything is coming out great, and it helped a lot with the code you gave me on the overlapping logo image.

I asked the person who I am recreating the site for to check over the dev site to see if I had missed anything. He told me about how the site is not coming out great on mobile.

Here are some examples of the Media queries I used:

@media only screen and (min-width: 480px) and (max-width: 910px) {
    .gridd-tp .gridd-tp-header {
        padding: 0 0 0 0 !important;
    }

    .entry-content .container {
        background-color: green;
        max-width: 800px;
        width: 600px;
    }

    .wp-block-image img {
         max-width: 80% !important;
    }

}

I still need to fix things so they look better on a mobile screen.

[aristath]

I don't understand... What is the issue here?

[paaljoachim]

When I check the site http://maguti.no/ with my mobile I see the header area squashed. If I check an online mobile checker site it looks alright. I have tried adding the correct media querry but it is still not looking good.