Codeless
  • Support Home
  • Themes
  • Support
  • WordPress Tutorials
    • How to Start a Blog
    • Best Website Builders
    • Best Small Business Hosting
    • Email Marketing Services
    • Cheap WordPress Hosting
  • Video Tutorials

Community Forums

Responsive mobile site width not correct – odd extra space

Mobileresponsiveresponsive width
    • 9 years, 3 months ago bedfordevan
      Participant

      Expired

       

      When testing our site on mobile devices, at first glance the site seems to fit correctly except for two issues.
      First the logo is cut off and extends past the edge of the screen to the right. What do I do to correct this?

      Second, while scrolling, there is a strange empty white column/space on to the right of every page so when trying to scroll up and down on the page, you can actually scroll horizontally some as well and as a result, the left side of the page is cut off and doesn’t realign itself to fit the mobile browser. What do we do to fix it? Take a look at the screenshots below to see what I mean.

      Click here to view the site.

       

    • 9 years, 3 months ago Mirela
      Participant

      Hello,

      Please add this code into your custom css box, for the logo in mobile:

      @media (max-width: 979px){
      .mobile_small_menu { left: -47px !important;}
      #logo img.dark { left: -84px;}
      }

      Add this code for the scrolling horizontally:

      @media (max-width: 979px){
      .tp-caption { font-size: 30px !important;}
      }

      Let us know.

      Best regards!

    • 9 years, 3 months ago bedfordevan
      Participant

      Expired

      This did fix the logo in mobile view. But now the menu icon isn’t displayed correctly. And the logo in the slide out menu is cut off the screen too. We tried to adjust the position of the menu by changing the following
      <span style=”color: #444444; font-family: Inconsolata, Consolas, Monaco, ‘Lucida Console’, monospace; font-size: 15px; line-height: 24px; white-space: pre; background-color: #f9f9f9;”>.mobile_small_menu { left: 20px !important;}.

      </span>When we did that, the menu would be in the correct placement initially, but after touching it to pull out the side menu, it would jump to a new position on top of the logo.

      The code for the scrolling horizontal issue didn’t work.

    • 9 years, 3 months ago bedfordevan
      Participant

      Expired

      (Tried to copy and paste the code you mentioned in my explanation above and its wrong.)

      The code we changed to adjust the position of the menu as mentioned above was the following:
      .mobile_small_menu { left: 20px !important;}

    • 9 years, 3 months ago bedfordevan
      Participant

      Expired

      I’m still waiting for a response. Can you help?

    • 9 years, 3 months ago Mirela
      Participant

      Hello,

      Sorry for the late reply.
      The horizontal scrolling was due to the side menu. Since it is a normal vertical menu now, the horizontal scrolling is gone (i opened your site and didn’t get it).
      We will double check it too and make the necessary edits in the next theme update.

      Best regards!

Viewing 5 reply threads

You must be logged in to reply to this topic.

Login

Log In
Register

Renew Support

  • Renew Specular Support
  • Renew Tower Support
  • Renew Folie Support
  • Renew Handel Support
  • Renew June Support
  • Renew Picante Support
  • Renew Thype Support
  • Renew Regn Support

Search Forums

Forums

  • Bygge – Construction Theme
  • Converta – Software Theme
  • Folie – The WordPress Website Builder
  • Handel – Responsive Multi-Purpose Business Theme
  • June WooCommerce WordPress Theme
  • Livecast – Podcast Theme
  • Picante – Restaurant & Food WordPress Theme
  • Regn | Agency & Business WordPress Theme
  • Remake – Minimal Portfolio & Agency Theme
  • Specular – Multi-Purpose WordPress Theme
  • Suggest us Features
  • Tower – Business-Driven Multipurpose WP Theme
  • Vibrance – Photography Theme

Site Links

  • Support Policy
  • Specular Support Forum
  • Video Tutorials
  • Knowledge Base
  • Guides and Reviews

Useful Articles

  • Build a Website
  • Web Design & Development
  • Hosting
  • WordPress

Login

Log In
Register Lost Password