Bootstrap - Modal appearing under background

Modal appearing under background

The problem has to do with the positioning of the parent containers. You can easily "move" your modal out from these containers before displaying it. Here's how to do it if you were showing your modal using js:

$('#theModal').appendTo("body").modal('show');

Or

$('#theModal').appendTo("body")