• 0

Why does "viewport" meta affect my Blog page differently


Question

Hi all. I'm trying to get my site to look a bit better in mobile browsers. I've set the following for my viewport:

<meta name="viewport" content="width=480">

When I check the site on an iPhone, all of the pages fill the screen just as I want them to with the exception of the Blog page. I can't for the life of me figure out why that page is different. There is nothing in the source that I can find that would cause different behaviour. I would really appreciate it if someone can help me out here.

The site: http://www.iriefirestudio.com

Link to comment
Share on other sites

3 answers to this question

Recommended Posts

  • 0

don't have a phone handy to verify. random suggestion: have you tried viewport: device-width? the whole tag is a mess because of the way the mobile browsers fake ****.

Link to comment
Share on other sites

  • 0

I figured out it had to do with the height of the page. As there were no actual blog posts yet, the height was really small and the browser seemed to zoom in so the height filled the page.

Now I have a new issue though. That brick wall pattern on the home page. Centred fine on desktop, completely out of whack on mobile.

Link to comment
Share on other sites

  • 0

I figured out it had to do with the height of the page. As there were no actual blog posts yet, the height was really small and the browser seemed to zoom in so the height filled the page.

Now I have a new issue though. That brick wall pattern on the home page. Centred fine on desktop, completely out of whack on mobile.

You have the brickwall in its own div and you've used position:absolute. That'll likely be the reason it doesn't centre right on smaller screens

Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.