user3117275 user3117275 - 6 months ago 16
CSS Question

Horizontal Scroll - Mac Safari only

I'm getting a horizontal scroll, but only on Mac Safari. I can't replicate the issue elsewhere, and it's hard to troubleshoot (I usually use Firebug on Firefox for this).

The url is

http://getinjuryanswers.com


I would be happy to paste the code, but I'm not even sure what code to target.

Any feedback would be appreciated.

Thanks.

Answer

Add overflow: hidden to outermost wrapper to fix scroll bar issue:

.site-container {
    overflow: hidden;
}

To avoid this scroll bar issue I always use following structure and it never disturbs me..

HTML:

<html>
    <head></head>
    <body>
        <div class="wrapper">
             <header class="header></header>
             <main class="main></main>
             <footer class="footer"></footer>
        </div>
    </body>
</html>

CSS:

body {
    margin: 0;
    // and other necessary properties for your page.
}
.wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
}