Я пытаюсь поместить div над другим div в bootstrap, я не изменил никакого CSS-бутстрапа, поэтому весь код ниже загрузочный без добавления пользовательского css.bootstrap 3 z-index разместить div над другим div
<div class="col-lg-3 listing-panel side-bar-for-single-listing" style="margin-top: 10px;">
<div class="col-lg-12" style="z-index: 999; background: red; height: 40%;"> </div>
<form class="col-lg-12" style=" ">
<legend>Contact</legend>
<div class="form-group">
<label for="IDinputName">Name*</label>
<input type="text" class="form-control" id="IDinputName" placeholder="Name">
</div>
<div class="form-group">
<label for="IDinputMobile">Mobile*</label>
<input type="text" class="form-control" id="IDinputMobile" placeholder="Mobile" >
</div>
<div class="form-group">
<label for="IDinputMessage">Message*</label>
<textarea id="IDinputMessage" class="form-control" style="height: 100px;"></textarea>
</div>
<button type="submit" id="IDcontactSubmitBtn" class="btn btn-primary">Send</button>
</form>
</div>
вот что я в настоящее время имеющий я хочу красную коробку, чтобы покрыть 100% элемента формы: