Support » Fixing WordPress » Pages Not Displaying Properly on Mobile

  • Resolved usefulbattery


    Hello everyone,

    I’m building a web page for a client and I’m just about done. However I am having some display problems with Safari and mobile devices. My header, logo and navigation are all out of whack and overlapping each other. There does not appear to be a problem in IE, Firefox or Chrome. I removed the responsive structure, but want the whole site to scale down proportionally for devices with smaller screens.

    I am noticing that the homepage displays correctly (minus the top portion) on my iPad3, but the Apply, News and Contact pages are not scaling-down like the homepage. They cut off on the right side.

    I am using a child version of the Twenty-Eleven theme. I will include some screenshots to show what I am talking about.

    I am close to wrapping this site up so if anyone can help me get over this last hurdle I would appreciate it.


    Correct SS

    Incorrect SS


Viewing 6 replies - 1 through 6 (of 6 total)
  • Moderator Andrew Nevins


    Forum moderator

    I can’t find any CSS that applies the scaling of your website in your Child Theme’s stylesheet, so I can’t experience the scaling down issues you experience.

    At the moment I do not have anything designating what the site should do on smaller screens. However my homepage and staff page fit properly as is while the others do not. Is there a global fix I need to consider correcting?

    I think maybe I should be a little more specific in the hopes of getting a response…

    I’m using some negative margins in the logo, header and navigation and I have a feeling it might be what’s screwing me up. Are negative margins a no-no when it comes to for formatting? What would be the most appropriate way of setting up the structure of my site?

    Moderator Andrew Nevins


    Forum moderator

    Negative margins do screw around with browser compatibility in general, but without seeing a working example of the problem, the issue is difficult to diagnose.

    There are two screenshots in my first post, showing how it looks in certain browsers. there is also a link to the site for a live example.

    Still having an issue. Z-index was able to resolve some problems but it still isn’t looking quite right in Safari. Should I keep trying for a solution with z-indexing or is there a better alternative out there?

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Pages Not Displaying Properly on Mobile’ is closed to new replies.