html - Create a margin between two columns without effecting grid layout -
in body of page have split 12 columns body 8 columns wide , sidebar 4 columns wide. these 2 areas different colour background, want them appear if on top of background. problem when set margin between 2 areas in order make them appear 2 separate areas effects layout of website have 8 columns, 4 columns , margin, sidebar pushed below content. how add in margin separate 2 areas without destroying bootstrap's grid layout? edit: know nest them , add in column between 2 areas, want margin of 15px between 2 areas. code: <div class="container"> <div class="row"> <div id="content" class="main-content-inner col-sm-12 col-md-8 bg"> </div> <div class="sidebar col-sm-12 col-md-4 bg"> </div> </div> </div> .bg { background-color: #fff; } .sidebar { padding-top: 40px; border-left: 15px solid transparent; } you can change width o...