Диалог пользовательского бутстрапа

Question

Я пытаюсь создать настраиваемый диалог начальной загрузки, где кнопки действий на нижнем колонтитуле должны быть выровнены по вертикали с правой стороны. Вот то, что я до сих пор (jsFiddle) Это дает:

То, что я хочу достичь, это что-то вроде:

Проблема Как расколоть самозагрузки диалог в две части? Один для кнопок справа, а другой для содержимого слева? кажется, что использование этого не делает это

<div id="myModal1" class="modal hide" tabindex="-1" role="dialog"> 
    <div class="modal-dialog large"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close pull-right no-padding" data-dismiss="modal" aria-hidden="true">x</button> 
     </div> 
     <div class="modal-body"> 
     <div class="row no-margin"> 
      <div class="col-xs-8"> 
      ... content here.... 
      </div> 
      <div class="col-xs-4 action-buttons"> 
      ... buttons here .... 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
</div> 

Answer 1

Одна проблемы может быть, что вы используете Bootstrap 3.x разметку, но ваша скрипка включая Bootstrap 2.x

Использование Bootstrap 3, мало пользовательского CSS нужно ...

.action-buttons { 
    padding: 5% 0; 
} 
.list-unstyled { 
    padding: 10% 0; 
} 

http://www.bootply.com/LA8IWDd7KW

Answer 2

Добавить пользовательские классы:

<div class="col-xs-8 realign-right"> 
    ... content here.... 
</div> 
<div class="col-xs-4 action-buttons realign-left "> 
    ... buttons here .... 
</div> 

Оберните ваши кнопки, дать им пользовательский класс:

<div class="col-xs-4 realign-left"> 
    <div id="squeeze"> 
     <button class="btn customb" data-dismiss="modal" aria-hidden="true">Close</button> 
     <button class="btn btn-primary customb">Save</button> 
    </div> 
</div> 

Добавить пользовательские CSS:

.realign-right { 
    display: inline-block; 
    width: 70%; 
} 


.realign-left { 
    display: inline-block; 
    width: 25%; 
} 

#squeeze { 
    display: block; 
    float: right; 
    margin-bottom: 90px; 
    margin-right: 15px; 
    width: 45px; 
} 

.customb { 
    margin: 4px; 
} 

Your result should look like this | JSFIDDLE

Вот почему я ненавижу бутстрап. Каждый раз, когда я пытаюсь сделать что-то обычай, я в конечном итоге переписываю bootstrap CSS.