Question

71

how to change the default positioning of modal in bootstrap?

rated 0 times [ 73] [ 2] / answers: 1 / hits: 154067 / 10 Years ago, mon, july 14, 2014, 12:00:00

<div class=modal>

  <div class=modal-dialog>

    <div class=modal-content>



      <div class=modal-header>

        <button type=button class=close data-dismiss=modal aria-hidden=true>×</button>

        <h4 class=modal-title>Modal title</h4>

      </div>



      <div class=modal-body>

        <p>One fine body…</p>

      </div>



      <div class=modal-footer>

        <button type=button class=btn btn-default data-dismiss=modal>Close</button>

        <button type=button class=btn btn-primary>Save changes</button>

      </div>



    </div>

  </div>

</div>

how can I change the default modal position in bootstrap, where should I edit to change the default position.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

ryans

Add To Favorites

Follow

Total Points: 514

Total Questions: 92

Total Answers: 121

Location: Liberia

Member since Fri, Oct 22, 2021

3 Years ago

answered 10 Years ago raveno · Accepted Answer

Add the following css to your html and try changing the top, right, bottom, left values.

.modal {

   position: absolute;

   top: 10px;

   right: 100px;

   bottom: 0;

   left: 0;

   z-index: 10040;

   overflow: auto;

   overflow-y: auto;

}