Basic Question on how to remove margins from nested bootstrap containers

Question

I'm trying to learn bootstrap grids, and started out with this pseudo-code. I started with 3 columns:

container  
   row  
       col-4  
       col-4  
       col-4  

Well, then I realized I needed to change the layout to this:

container
row
col-8
container
row (I needed to put two columns nested inside col-8)
col-6
col-6
col-4

It works fine. But the inner nested col-6 divs have margins that squish the left and right sides in more.
Is there a way to get the col-6 divs to go back out and press against the col-8 sides, to give it more width?

In other words, all the default left/right margins and/or padding make the nested columns smashed inward a little.

I hope that makes sense!

Answer 1

Hi @Coreysan ,
I think,your meaning is moving the padding between col-6 and col-8. Just like this:

You need to change the css in the Bootstrap.cs file. Please change "padding:0px". Just like this:

156521-new-text-document-3.txt

Maybe your Bootstrap's version is different with my,so I suggest you could press F12 when you run your page and select the Elements to check your css. Just like this:

Best regards,
Yijing Sun

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer 2

Excellent - thank you!!!!