Как изменить расположение модальной кнопки

Question

Я не могу понять это. Я использую Bootstrap modal для своего сайта, и я хочу изменить расположение кнопки, а не диалоговое окно. Независимо от того, что я меняю, он застрял слева от страницы. Это то, что у меня есть в индексе

<!-- Button trigger modal --> 
    <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">Create Event</button> 

Как бы переместить это по странице?

Answer 1

Еще один способ использования свойств верхнего, нижнего, левого и правого CSS. Вот некоторые из них: documentation. Вот jsfiddle http://jsfiddle.net/gV6y8/84/ Я отредактировал, что перемещает модальную кнопку вокруг. Надеюсь, поможет.

Вот код внутри скрипкой:

HTML:

<a id="modalbutton" data-toggle="modal" href="#defaultModal" class="btn btn-primary btn-large">Default Modal</a> 
    <br> 

    <div id="defaultModal" class="modal fade"> 
     <div class="modal-dialog"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button> 
        <h4 id="modal-label">Example Without Pull Right Modal</h4> 
       </div> 
       <div class="modal-body"> 
        <form> 
         <textarea class="form-control" rows="3"></textarea> 
         <button type="submit" class="btn btn-success">Submit</button> 
        </form> 
       </div> 
      </div> <!--modal-content--> 
     </div> <!--modal-dialog--> 
    </div> <!--modal--> 

CSS:

#modalbutton{ 
     position:absolute; 
     bottom:100px; 
     left: 400px; 
    } 

Answer 2

если вы посмотрите в CSS, вы можете увидеть следующий класс:

.close { 
    float: right; 
    font-size: 21px; 
    font-weight: 700; 
    line-height: 1; 
    color: #000; 
    text-shadow: 0 1px 0 #fff; 
    filter: alpha(opacity=20); 
    opacity: .2; 
} 

Я хотел бы создать другую таблицу стилей, которая загружает после этого в документе, и добавить еще один .close класс и добавить float:left;