Bootstrap2 20px padding on both-sides of screen at 767px and below

Question

good evening, I am using Joomla built in Bootstrap2. I am making website in full width view, the problem is below 768px 20px padding add on both sides of the screen. I have added following but its not working:

@media (max-width:767px) {

    .container-fluid {
     padding: 0;
    }
}

Thank you for your help.

Regards,

Answer 1

You need to update the rule defined in the responsive-bootstrap.min.css. Code in that file is :

@media (max-width:767px) {    
    body{
     padding-left: 20px;
     padding-right: 20px;
    }
}

So to make it zero you have to override that rule so replace your code with this:

@media (max-width:767px) {    
    body{
     padding: 0px;
    }
}