Overflow on mobile when layout set to Boxed

- 8 years, 3 months ago abacusit
  Participant
  
  Expired
  
  Our website does not look okay, on mobile, when our layout is set to Boxed, with a fixed background image. The footer is off to the left, on top of the background image and the logo is off to the right, over the background image.
  
  Also, when clicking on the hamburger menu from a mobile device, there is a hesitation in loading, where the content of the page shows above the hamburger menu and then it quickly disappears. I noticed this for the Business Minimal demo as well.
  
  How can we get a nice responsive look on mobile, with our current setup? We are trying to go off of the Business Minimal theme.
  
  Our website is dev.one2oneus.com.
- 8 years, 3 months ago Mirela
  Participant
  
  Hello,
  
  Please send us your wp credentials in a private reply. So we can fix these issues.
  You can add the data in your profile settings in this support forum.
  Please read this article for more detailed guidance.
  
  Let us know.
  
  Best regards!
- 8 years, 3 months ago abacusit
  Participant
  
  Expired
  
  Hello,
  
  I have added the credentials to my profile. Please let me know if you need anything else.
  
  Thank you
- 8 years, 3 months ago Mirela
  Participant
  Hello,
  
  I edited the Boxed Container Width with percentage value to 100% in General Options > Layout.
  I added this code into your custom css box:
  
  @media (max-width: 767px) { footer#footer .inner .row-fluid.ff .span12:first-child:last-child { margin-left: 0 !important; } .boxed_layout { padding-left: 7% !important; } }
  
  Please go to file css/bootstrap-responsive.css and find this line:
  
  footer#footer .inner .row-fluid.ff .span12:first-child:last-child { margin-left: -210px !important; }
  
  Remove the !important from it and save file.
  After the above edit, the site should look like this: screenshot.
  Let us know.
  
  Best regards!
- 8 years, 3 months ago abacusit
  Participant
  
  Expired
  That’s a step in the right direction but we’re not completely there yet.
  
  I made the following change to the css file:
  
  footer#footer .inner .row-fluid.ff .span12:first-child:last-child{ margin-left:-210px; }
  
  When I pull up the site on Chrome or Safari on my iPhone, the site is kind of zoomed in and the background image is wider than the screen.
  
  See the linked screenshots below. The first is the initial load of the site, and the second is when I zoom out with 2 fingers.
  
  https://postimg.org/image/yfyijntv3/
  
  https://postimg.org/image/9nywcfcof/
  
  This reply was modified 8 years, 3 months ago by abacusit.
- 8 years, 3 months ago abacusit
  Participant
  
  Expired
  
  Hello, is there any progress with this? We need our site to be mobile friendly.
- 8 years, 3 months ago Kris
  Participant
  
  Hello,
  
  Sorry for the delay. We are working on resolving this issue.
  You will be updated as soon as we fix it.
  
  Best regards!
- 8 years, 3 months ago Ruco
  Keymaster
  
  Hello,
  
  We fixed it. Removed the padding you have added at the empty columns beside the slider at the bottom.
  
  Best regards!
- 8 years, 3 months ago abacusit
  Participant
  
  Expired
  Thank you!
  
  How can we fix the overflow of the icon at the top though?
  
  I have found how to change the padding of content on each page, via Visual Composer so that things aren’t pressed up against the edge, in mobile, but I cannot figure out how to fix our logo when viewing on mobile. The header logo overflows over the background image.
  
  This is happening on iPhone5. iPhone6 seems to look okay, when viewing with portrait orientation.
  
  This reply was modified 8 years, 3 months ago by abacusit.
- 8 years, 3 months ago Kris
  Participant
  Hello,
  
  Please check your site, we fixed. Just added this code to your custom CSS box:
  
  @media (max-width: 320px){ #logo img { margin-left: -185px; } .mobile_small_menu { margin-left: 20px; } }
  
  Let us know.
  
  Best regards!
- 8 years, 3 months ago abacusit
  Participant
  
  Expired
  
  It looks like that fixed it!
  
  Thank you for your support!

Viewing 10 reply threads

You must be logged in to reply to this topic.

Community Forums

Overflow on mobile when layout set to Boxed

Site Links

Useful Articles

Login