2013-05-26 5 views
2

Я использую класс Bootstrap btn-group для реализации меню. В меню используется класс btn-large для отображения больших кнопок. Во время генерации страницы скрипт Python проверяет каждую кнопку на создаваемой странице. Если кнопка представляет текущую страницу, она добавляет значок перед меткой. Ничего сложного:Группа кнопок Bootstrap получает неправильную высоту кнопки

{% for page in pages %} 
     <a id="{{ page.name|slugify }}" class="btn btn-large btn-success" href="{{ page.url }}" > 
     {% if page.name == current_page.name %} 
      <i class="icon-ok icon-white"></i> 
     {% endif %} 
     {{ page.name }} 
     </a> 
{% endfor %} 

Однако я заметил, что кнопка, которая имеет значок в этикетке на самом деле оказывается один пиксель больше, чем другие кнопки в группе (проверьте верхнюю часть проверяемого кнопки на изображении ниже) , Это происходит только при использовании btn-large; другие размеры отображаются правильно.

enter image description here

выше делается с Chrome 27 на Mac OS X; Safari отображается правильно, в то время как Firefox имеет ту же проблему, но делает кнопку больше внизу. Bootstrap version 2.3.1

Мой вопрос: легко ли это сделать?

ответ

2

Вы пробовали поставить max-height для вас btn-large class?

+0

Отлично! благодаря – Roger

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