[FIXED] Scrollbarwidth prevents document from 100% width


I’m trying to have this view or two columns, one is taking the third of the page and the other is taking 1/3 (the rest of the page). All works fine.

        var height = $(window).height();
        var width = $(document).width();
        var right = (width/3);
        var about = width - right;

        $('#events').height(height - (height/2));

        $('#about, #contact').width(about);

When I first load the page, automatically the scrollbar shows up then disappears, and this causes a margin of 17px, I have to resize the browser to have it back to normal…

Is there anyway to prevent this? Since the height always adapts to the window’s height.


I have found a solution. I used

html {
    overflow: hidden;

then use jquery to show it on other screens

if (width <= 1024){
        "overflow": "visible"

Answered By – Bououm

Answer Checked By – Mary Flores (FixeMe Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *