CSS to solve a problem with the Mobile version of one page

• 

  mmspd · Member · Feb 5, 2017 at 4:28 pm

  • Copy link
  • Add topic to favorites

  Hi there! I need help with a CSS code to help me with one of my pages on the mobile version. The page is https://wordpress.com/page/behind.pt/170 and what happened is that I have increased the width of only this page, but now is not showing properly on the mobile version and I would like to solve this. I guess it would be with some CSS. It happened before with another two pages where I have big letters and now is solved, but I guess is different code for this. Thanks

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

• 

  staff-loquaciousloon · Staff · Feb 6, 2017 at 5:00 pm

  • Copy link

  Hi there!

  The CSS you’re using now:

  .page-id-170 .entry-content {
  	width: 130%;
  	position: relative;
  	left: -140px;
  }

  Sets the post content to be wider (130%) than the column it’s contained in, and then shifts it to the left (-140px), which is why you can’t see all of the content on mobile – 140px to the left on a cell phone is off of your screen :)

  Instead of enlarging and moving the content, I’d recommend making the maximum width of the container bigger.

  Replace the above CSS with this:

  .page-id-170 .site-content-wrapper {
  	max-width: 75em;
  }

  That will allow the content to be larger on large screens, but it won’t let it extend beyond the screen edges on smaller screens :)

• 

  mmspd · Member · Feb 6, 2017 at 9:59 pm

  • Copy link

  Thank you so much! it solved the problem!

• 

  mmspd · Member · Feb 7, 2017 at 10:12 am

  • Copy link

  Hi there again. After all I did solve the problem I mentioned here, but is seems another one emerged. So the width problem of that specific page is perfect. But my welcome page and all its child pages now have more “height” than before. So now I have a lot of space empty after the text, fromone page to the other. Would this have something to do with the width change I´ve done? Thanks

• 

  mmspd · Member · Feb 7, 2017 at 10:29 am

  • Copy link

  Nop… this one is solved as well! no worries. thanks!

• 

  staff-loquaciousloon · Staff · Feb 7, 2017 at 3:50 pm

  • Copy link

  You’re welcome! Happy to help :)