2016-01-12 2 views
0

Я создаю нижний колонтитул bootstrap modal, и я бы выровнял панель инструментов btn справа от текста. Я попытался с помощью следующего кода:Как выровнять панель инструментов btn вправо?

<div class="modal-footer"> 
    <div class="text-center alert alert-danger"> 
     <p>confirm deletation? 
     <span class="btn-toolbar pull-right"> 
      <button class="btn btn-success btn-flat fa fa-times"></button> 
      <button data-dismiss="modal" 
        class="btn btn-success btn-flat fa fa-check"></button> 
     </span> 
     </p> 
    </div> 
    </div> 

, но я получаю следующий результат:

Как вы можете видеть группу кнопок справа, не совпадает с текстом. Как это исправить?

enter image description here

ответ

0

Я думаю, вам нужно использовать в инлайн класса.

Нечто подобное, хотя вы, возможно, придется работать на обивке:

<div class="modal-footer"> 
    <div class="alert alert-danger"> 
    <div class="btn-toolbar inline pull-right"> 
     <button class="btn btn-success btn-flat inline fa fa-times"></button> 
     <button data-dismiss="modal" class="btn btn-success btn-flat inline fa fa-check"></button> 
    </div> 
    <p>confirm deletation?</p> 
    </div> 
</div> 

Вот JSFiddle

+0

Это то же самое сул мой! – smartmouse

+0

В моем ответе текст выравнивается по правому краю с помощью кнопок. Разве это не то, что вам нужно? –

+0

@smartmouse, глядя на ваш ответ на другой ответ, пытаетесь ли вы вертикально выровнять текст? В вашем вопросе вы говорите правду. –

0

добавить этот стиль

style="margin-top: -5px;" 

так:

<div class="modal-footer"> 
    <div class="text-center alert alert-danger"> 
     <p>confirm deletation? 
      <span class="btn-toolbar pull-right" style="margin-top: -5px;"> 
      <button class="btn btn-success btn-flat fa fa-times"></button> 
      <button data-dismiss="modal" 
        class="btn btn-success btn-flat fa fa-check"></button> 
     </span> 
     </p> 
    </div> 
    </div> 
Смежные вопросы