Приветствую!
Ребят, столкнулся со следующей проблемой:
<ul class="my-menu">
<div class="btn-group" role="group" aria-label="...">
<li><button type="button" class="btn btn-success menu-button"><a href="/">Главная</a></button></li>
<li><button type="button" class="btn btn-success menu-button"><a href="/trotuarna-plitka/">Тротуарная плитка</a></button></li>
<li><button type="button" class="btn btn-success menu-button"><a href="/border/">Бордюр</a></button></li>
<li><button type="button" class="btn btn-success menu-button"><a href="/shlakoblock/">Шлакоблок</a></button></li>
<li><button type="button" class="btn btn-success menu-button"><a href="/cement/">Цемент</a></button></li>
<li><button type="button" class="btn btn-success menu-button"><a href="/shifer/">Шифер</a></button></li>
<li><button type="button" class="btn btn-success menu-button"><a href="/truba-azbocement/">Труба асбестоцементная</a></button></li>
<li><button type="button" class="btn btn-success menu-button"><a href="/sipuchi-materiali/">Сыпучие материалы</a></button></li>
</div></ul>
.menu-button{
background-color: #379037;
text-transform: uppercase;
border: 1px solid transparent;
border-radius: 2px;
}
.menu-button:hover{
background-color: #2d7c2d;
text-transform: uppercase;
border: 1px solid transparent;
border-radius: 2px;
}
ul.my-menu,
ul.my-menu li {
list-style: none;
padding: 0;
margin: 0;
}
ul.my-menu li {
float: left;
}
ul.my-menu li {
display: block;
background: #449d44;
text-decoration: none;
}
/*добавочный класс для текущего(выбранного) пункта*/
ul.my-menu li .current {
padding: 4px;
border: 1px solid rgba(255, 255, 255, 0.6);
border-radius: 1px;
}
Остальные стили - бутстраповские..
В google chrome данное меню работает. В firefox - нет.
В чем может быть проблема?
Спасибо.