I've messed up my mobile version of my site — Help!

  • Unknown's avatar

    With the CSS tweaking I’ve the last few days, I just realized that I’ve messed up what the website looks like on my phone.

    Can someone tell what I should do after looking at my site on their phone?

    Thank you!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    (Sorry for the typos above! My thumbs and my brain weren’t quite synced up!)

  • Unknown's avatar

    Pages that are formatted weird on my phone:

    Team Club Hub
    Contact Us
    Our Staff
    Photo Gallery

    Some pages still look fine — where the content is large and easy to see (not off to the side and small) and the widgets are viewable by scrolling down and they are stacked on top of each other.

  • Unknown's avatar

    Find this in your custom CSS and remove it. It is what is causing the issue.

    .content-wrapper {
    	padding:2em 55px 0 201px;
    }

    I didn’t check all of your pages, but checked several and this seems to have taken care of the issue. It looks like the reason this did not affect all pages is that the other pages have featured images, so the CSS selector is more specific and the above does not get applied.

  • Unknown's avatar

    That did it. Thank you!!

  • Great! I’ll mark this thread as resolved but feel free to start a new one if you need help with anything else.

  • The topic ‘I've messed up my mobile version of my site — Help!’ is closed to new replies.