Black Bar on Mobile

[mironkedz]

Hello,

I found a similar post but their solution did not work for me. I have a site that shows a black bar on the right side but only when viewing on mobile phones. I also noticed it does cut off some of the writing from the columns.

Can you please assist or point me in the right direction?

https://mintcarpetstx.com/

Thanks,

[Prasant]

Hello @mironkedz,

Thanks for writing in!

The black bar is coming because of horizontal scroll on the website. However, I see that you are using Cornerstone on the website and default WordPress Twenty sixteen theme.

Further checking the code I see that the horizontal scroll and black bar is coming because of following code:

#metaslider_container_235 {
    margin-right: -60px;
}

.content-area-wide {
    float: center;
    margin-right: -100%;
    margin-left: -10%;
    width: 120%;
}

First there a CSS error as Float is never Center. To learn more, please take a look at following resource. https://www.w3schools.com/css/css_float.asp

If you would like to limit the changes to desktop screen please delete above code and use following:

@media only screen and (max-width: 600px) {
 #metaslider_container_235 {
    margin-right: -60px;
}

.content-area-wide {
    margin-right: -100%;
    margin-left: -10%;
    width: 120%;
}
}

I see that you have added above codes in child theme style.css file.

Thanks.

[mironkedz]

Hi Prasant,

Thank you for your reply. I made the changes but on mobile it still shows the black bar and it cuts off some of the writing on left and right. Any recommendations please?

Thanks,

[ruenel]

Hello @mironkedz,

We have investigated the issue in anyway we can. The black bar has something to do with the layout of your page. You may need to check with your custom code of how the page layout is constructed. If you have this site developed with a developer, you might need to contact him to be able to resolve this black bar issue.

I can see that the site is using TwentySixteen theme with Cornerstone plugin active. Please understand that Cornerstone plugin do not interfere with the theme used in the site. It only follows and display the contents created in Cornerstone within the theme’s content area. This issue is not a Cornerstone related issue. It has something to do with the theme that you are using.

Thank you for your understanding.