Need help? Check out our Support site, then

blog looks messed up on smartphone

  1. I just changed the design on my blog and it looks great on a computer but on my iPhone everything looks messed up. It seems like the whole website is pushed to the right so I can only see a tiny bit of my images etc. What can I do to fix this? The url is

    The blog I need help with is

  2. Are you using the Custom Design upgrade?

  3. yes!

  4. Then I'll flag this to move into the CSS forum instead. When you do custom design, you DO have to account for different browsers, and that includes mobile ones.

  5. ok thanks. I was just trying to change the width of the side widget area a little bit and make the post area a little bigger so that I could have bigger pictures. I don't know why it got shifted to the right on some browsers. I'm not very good at CSS so if you have any idea how I can change this back I would really appreciate it.

  6. Linda, if you go to appearance > custom design > edit CSS, do you have this selected?

    On Mobile
    Include this CSS in the Mobile Theme

  7. Also, do you have the mobile theme activated at appearance > mobile?

  8. Hi! Yes both of those are selected... should I deselect them?

  9. Since your site is not a responsive theme design, you need the mobile active.

    You might try deselecting the

    On Mobile
    Include this CSS in the Mobile Theme

    It will mean the mobile goes back to the standard mobile design, but it would be readable.

    The alternate would be to turn off the mobile entirely and then just let people view the full site.

    I'm not sure what is messing up the mobile theme as I've never worked with CSS and those themes before.

  10. I do notice that there are some inconsistencies in the widths you have set, but I don't know if that is an issue or not.

    Change the width in #access back to 940px to match the parent div widths.

    I would also suggest redoing your custom header image and make it 940px wide. Right now it is 1024px wide and that might cause some issues although I'm not sure.

    Lastly you need to make the standard theme and WordPress stuff in the footer visible. We are not allowed to hide the WordPress and theme credits here at

  11. Thank you so much! I did what you wrote and it finally looks good again.
    I have one last question if I may ask. My site can now scroll slightly to the right and back when I look at it on a laptop. It didn't use to be like that and I was wondering if you know how I can change it back so that you can only scroll up and down. Once again thank you so much for your help!

  12. The width on your site looks good now at 940px, except for the header image, which is 1024px in width. You can upload a new header image at 940px wide, or alternately you can add the following CSS to take care of the issue.

    #header {
    overflow: hidden;

    All it does is tell the browser to ignore the extra width on the header image.

  13. Great thank you so much for all your help! I will make a new header that is 940px :)

  14. You are welcome.

Topic Closed

This topic has been closed to new replies.

About this Topic