how to remove padding from container-fluid without causing horizontal scroll bars to appear in boots-CodePudding

The bootstrap class container-fluid gives a padding of 15px to the left and right of everything in it. When I create another class to remove the padding left and right the container-fluid gives, I get a horizontal scroll bar as a result. How do I fix this? I want everything in container-fluid to cover the entire width with no space on either side.

CodePudding user response：

container-fluid shouldn't give a padding. If you use container-fluid the whole container will go to full 100% width.

Are you sure that you dont have a class that gives the padding?

CodePudding user response：

You do not need to create any CSS in order to change Bootstrap padding (or margins). In your HTML the following will work.

You can use any number between 0 and 5 where 5 is the most amount of padding.

 will create no padding at all.
 will create no horizontal padding.
 will create no vertical padding.

In addition.

 will change padding top.
 will change padding bottom.
 will change left side padding (padding-start).
 will change right side padding (padding-end).

* = insert number between 0 and 5

All of this works is you replace the p with an m if you want to change margins instead of padding.