html - Bootstrap col-* not taking full width -
i have following code:
<div class="row row-space"> <div class="row" style="border: 1px solid red;"> <div class="col-lg-6" style="border: 1px solid black;"> <div class="row"> <div>child a</div> </div> </div> <div class="col-lg-6" style="border: 1px solid black;"> <div class="row"> <div>child b</div> </div> </div> </div> </div> the problem is, .row divs take full width of parent outer div (as expected) ones col-lg-12 or (col-lg-6 + col-lg-6) not taking full width.
i expecting black boxes divided equally inside red box. not applying other styles html.
because parent col-lg-6, change col-lg-12
see more twitter-bootsrap grid here
update -based on updated well
you have unnecessary markup. see snippet below:
snippet
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> <div class="row row-space" style="border: 1px solid red"> <div class="col-lg-6" style="border: 1px solid black;"> <div>child a</div> </div> <div class="col-lg-6" style="border: 1px solid black;"> <div>child b</div> </div> </div> 
Comments
Post a Comment