OckhamsRazor
OckhamsRazor

Reputation: 4906

Bootstrap modal disappears on resize

Every time I resize my page, the Bootstrap modal suddenly disappears. I have googled this and typically, this happens if you include bootstrap.js and bootstrap-modal.js. However, I don't have bootstrap-modal.js included. Also, the modal works fine if my screen is fairly large. It is only when I resize it to a much smaller size that the modal disappears.

Here are my includes :

<script src="resources/scripts/jquery-1.8.3.js"></script>
<script src="resources/scripts/jquery-ui-1.9.2.custom.js"></script>
<script src="resources/scripts/bootstrap.js"></script>
<script src="resources/scripts/jquery.complexify.js"></script>
<script src="resources/scripts/jquery.jeditable.js"></script>
<script src="resources/scripts/bootstrap-tagmanager.js"></script>
<script src="resources/scripts/jquery.dataTables.min.js"></script>

<link rel="stylesheet" href="resources/styles/bootstrap.css" type="text/css"/>
<link rel="stylesheet" href="resources/styles/bootstrap-responsive.min.css" type="text/css"/>
<link rel="stylesheet" href="resources/styles/jquery.fileupload-ui.css" type="text/css"/>
<link rel="stylesheet" href="resources/styles/bootstrap-tagmanager.css" type="text/css"/>
<link rel="stylesheet" href="resources/styles/jquery.dataTables.css" type="text/css"/>

Upvotes: 1

Views: 1813

Answers (1)

OckhamsRazor
OckhamsRazor

Reputation: 4906

Sorry, nevermind. I noticed that you should include the modal inside the <div class="container"></div> and it works with resize only then. I had included it outside.

Upvotes: 2

Related Questions