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.