Site Margins throw things off on mobile.

  • 1
  • Question
  • Updated 3 years ago
  • Answered
  • 1
Hi. My site is www.natehenderson.me. The body has a left margin of 300px which makes up for the side bar that contains the navigation. On the mobile version, the sidebar transforms to a dropdown at the top so the margin doesn't need to be present. How should I fix this so everything isn't super squished to the right on the mobile version?
Photo of Nathan Henderson

Nathan Henderson

  • 157 Posts
  • 3 Reply Likes

Posted 3 years ago

  • 1
3 years ago
Photo of Brent

Brent, Official Rep

  • 64 Posts
  • 18 Reply Likes
Hi Nathan,

I took a look at your site. It looks like you are using some custom CSS to adjust the margin of your content area. As you point out, the problem is that this rule is interfering with the mobile view.

You can add the following CSS after your customization if you want to prevent your custom CSS from interfering with the content margin in the responsive view:

@media only screen and (max-width: 736px) {
   div.sidebar-left .content-wrapper {
      margin:0 10% 0 10%;
   }  
}

I hope this helps.
2015-10-20T23:14:42+00:00
Photo of Nathan Henderson

Nathan Henderson

  • 157 Posts
  • 3 Reply Likes
That worked. Thanks!
  • 1

Powered by Get Satisfaction