1

Такой вопрос: при такой верстке на бутстрапе ховер отрабатывается криво (подсвечивается только последний пункт). Тут http://jsfiddle.net/0hjf22w5/ работает нормально.

 <div class="col-xs-2">
            <h2>Категории</h2>
            <ul class="kat_list">
                <li><a href="#">Вид техники</a></li>
                <li><a href="#">Вид техники</a></li>
                <li><a href="#">Вид техники</a></li>
            </ul>
        </div>

.kat_list li{
padding-top: 5px;
padding-left: 5px;
height: 40px;
border-bottom: 1px solid #d9d9d9;
cursor:pointer;
display: block;
width: 100%;
/*background: #269abc;*/
}
.kat_list li a{
   color: #828282;
}
.kat_list li:hover a{
    color: #ff6600;
}

.kat_list{
    padding-left: 0px ;
    text-align: left;
    /*list-style: none;*/
}

До кучи, если панель разработчика открыта, все работает, как и должно. Если кто сталкивался, поделитесь опытом, заранее спасибо.

1 ответ 1

3

А почему ховер на li? Т.е. выходит, что Вы наводите справа от текста (видно на примере) и у вас засвечивается ховер, но при этом по клику ничего не произойдет.

Если не хотите давать стили непосредственно на a:hover, тогда сделайте так:

<li><a><span>text</span></a></li>

И стили выдавайте на спан, это будет более правильное решение.

Возможно, это же и решил Вашу проблему.

Я СДЕЛАЛ ОШИБКУ, НАПИСАЛ СПАН СНАРУЖИ A. Поправил.

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.