html - container-fluid leaving blank space -
i want use full width div, added container-fluid class leaves blank space on left , right. solved using negative margin left , right. problem negative margin afftects bootstrap responsive nature. when resize left side contents hidden , there horizontal scrollbar on resizing.
<div class="container-fluid"> <div class="row" style="background-color:gainsboro"> <div class="col-md-10"> </div> </div> </div>
the problem you're having padding result of classes calling. both col-md
series , container-fluid
come out of box with
padding-left: 15px; padding-right: 15px;
for padding of 30px
on each side combined. simplest way fix content being clipped creating own class include
.container-margin { margin-left: -15px; margin-right: -15px; }
the row
class take care of -15px
, , above take care of rest. way if ever chose use container-fluid
again, wouldn't same result of them.
here fiddle code updated.
Comments
Post a Comment