How to bring a modal to the front of the page using bootstrap?
- by sharataka
I am trying to implement a modal using bootstrap. When I click on the button the screen fades and the modal appears, but it appears behind the images in and is unreadable for the user. How do I bring the modal forward?
<div class ="container-fluid">
<div class = "row-fluid">
<div class = "span2">
<!-- Modal -->
<div class="modal hide fade" id="myModal">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h3>Modal header</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<a href="#" class="btn">Close</a>
<a href="#" class="btn btn-primary">Save changes</a>
</div>
</div>
<a data-toggle="modal" href="#myModal" class="btn btn-primary">Launch demo modal</a>
</div>
<div class = "span8">
#a lot of images in this div
</div>
</div>
</div>