2013-11-28 3 views
0

btn groupBootstrap 3 - как для того чтобы достигнуть полной ширины в одной кнопки в группе

<div class="input-group"> 
    <button class="btn btn-default full-width"> 
    <span class="pull-left"><i class="fa fa-sitemap"></i> Fills remaining width</span> 
    </button> 
    <div class="input-group-btn"> 
    <input type="submit" class="btn btn-default" value="submit"> 
    <button class="btn btn-default"> 
     <i class="fa fa-pencil"></i> 
    </button> 
    <button class="btn btn-default"> 
     <i class="fa fa-trash-o"></i> 
    </button> 
    </div> 
</div> 

Я использовал выше HTML для создания верхней группы кнопок. Я хотел бы настроить его, чтобы создать группу кнопок, более похожую на ту, которая находится внизу, где у вас нет закругленных углов с правой стороны самой широкой кнопки.

ответ

0
.full-width { 
    width: 100%; 
    -webkit-border-top-right-radius: 0; 
    -webkit-border-bottom-right-radius: 0; 
    -moz-border-radius-topright: 0; 
    -moz-border-radius-bottomright: 0; 
    border-top-right-radius: 0; 
    border-bottom-right-radius: 0; 
} 
.full-width span i { 
    margin-right: 10px; 
} 

В случае, если кто-то заинтересован, добавив эти стили к моему .Full шириной класса сделал трюк. Мне было бы интересно узнать, знает ли кто-нибудь Bootstrap 3 только один способ достичь такого же внешнего вида.

Смежные вопросы