using container-fluid within bootstrap cause horizontal scrollbar

container-fluid was originally taken out of Bootstrap 3.0, but added back in 3.1.1

To fix this, you can either:

  1. Use the newer version of Bootstrap style sheet

    Demo with New Style Sheet in Fiddle

  2. Or add in the class yourself

    The .row adds a 15px margin to the left and right. Since .container-fluid fills up 100% of the screen width, the extra margin space causes overflow issues.

    To fix this, you need to add padding to .container-fluid class

    .container-fluid {
        padding-right: 15px;
        padding-left: 15px;
        margin-right: auto;
        margin-left: auto;
    }
    

    Demo with Custom container class in Fiddle

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)