I need assistance with setting a background color to fill the entire div in a child div within bootstrap. I am having trouble achieving this and would like the right section to have a yellow background, rather than just highlighting the text within the div.
You can view my code on this fiddle.
Although it may be something simple that I'm overlooking, how can I ensure that the yellow color fills the entire col-lg-6 div?
.new-section {
height: 100%;
padding-top: 150px;
text-align: center;
background: #eee;
}
.yellow {
background-color: yellow;
}<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<section id="new" class="new-section">
<div class="container">
<div class="row">
<div class="col-lg-6">
<h1>Section left</h1>
</div>
<div class="col-lg-6 yellow">
<h1>Section right</h1>
</div>
</div>
</div>
</section>