Mobile Home Screen Horizontal Bar

  • Hi,
    Using GeneratePress theme and Premium plugin, don’t have the license key as previous developer used his global license and didn’t want to share it
    Have an issue with horizontal bar showing only on Home page only on mobile
    Added this script to Firefox console:
    [].forEach.call($$(“*”),function(a){a.style.outline=”1px solid #”+(~~(Math.random()*(1<<24))).toString(16)})
    It does show some elements are wider then screen, but can’t identify which elements
    The theme and plugin is on auto update so we have the latest version, but for some reason the mobile screen home page only is scrolling horizontally
    Any help greatly appreciated, unfortunately can’t attach screenshot
    Thanks,
    Joseph

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter iosefl

    (@iosefl)

    Hello, any help with the mobile horizontal bar please

    Hi there,

    apologies that your original topic didn’t make it through to our helpdesk.

    The site is built entirely with Elementor, including the header – so there is nothing in the Theme that would cause the issue. But i had a quick look at the site and the element causing horizontal overflow is the Product grid. It has -5rem right margin applied to it which is causing the problem. See here:

    https://www.screencast.com/t/rPbedARS

    Thread Starter iosefl

    (@iosefl)

    Hi David and thank you for replying
    I thought the theme is build in Elementor, it was customized by previous developer, I’m trying to fix the problems.
    The Home page is the only part that has horizontal bar on mobile screen only, no other pages have that on mobiles screen, not even the Product Shop page
    I applied custom css to the code you showed me:
    `@media (max-width: 767px)
    .elementor-2 .elementor-element.elementor-element-04a133b>.elementor-widget-container {
    margin: 0 0 0 0;
    padding: 0;
    }
    Refreshed and cleared cache, but i can still see the horizontal bar.
    Trying to find if there are other places with similar settings
    Thanks,
    Joseph

    ying

    (@yingscarlett)

    Hi Joseph,

    With the cache plugin on, we can’t see the code clearly.

    Can you try this CSS instead:

    @media (max-width: 768px) {
    body .elementor-2 .elementor-element.elementor-element-04a133b>.elementor-widget-container {
        margin: 0 0 0 0;
        padding: 0;
    }
}
    Thread Starter iosefl

    (@iosefl)

    Hi Ying,
    Great the code provided did remove the horizontal scrolling, but it also made the mobile home page product display element left aligned instead of center as it was before
    Could you please let me know if that can be adjusted to center
    Thanks,
    Joseph

    Leo

    (@leohsiang)

    Can you please check with Elementor’s support team on this first?

    Thanks.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Mobile Home Screen Horizontal Bar’ is closed to new replies.