Лишние линии при просмотре в Хроме

[Neformat]

Прошу помощи у специалистов

На сайте bestmebelik.ru в Chrome при открытии любой страницы в меню слева "Каталог статей" между некоторыми пунктами меню видны чёрные линии. Скриншот прилагаю. Выше, в блоке "Каталог продукции", такого нет, хотя, вроде бы, одними стилями оформлены и тот, и другой блок. И такое только в Хроме. Эти чёрные линии, кстати, пропадают если просто мышью провести над пунктами меню.

Вот что прописано в CSS:

#td_hover2 { text-decoration:none}
#td_hover { text-decoration: underline }
.cat { text-decoration: none; background: url(images/catalog_forma.gif) 15px 13px no-repeat; font-size:12px; font-weight:bold; color:#424e46; padding: 8px 0px 8px 30px; border-bottom:1px #cfd2ce solid }
.cat2 { }

Где что поправить в CSS и/или шаблонах, чтобы эти чёрные линии не появлялись? Или дело не в CSS?

 

[medwoodu]

у меня в хроме нормально показывается.

 

[Neformat]

Да, знаю, что это видно не у всех. Не понимаю почему, у меня и большинства коллег по-прежнему полное совпадение того, что видим, со скриншотом.

Я так понимаю, что суть проблемы в следующем: полоса под некоторыми пунктами меню "Каталог страниц" выводится чёрной, хотя в стилях прописано, что она должна быть серой. Что может быть причиной этому?

Вот код одного из пункта меню страниц:

<td class="cat2" valign="top" ><div onmouseover="this.id='td_hover'" onmouseout="this.id='td_hover2'" class="cat">Каталог 2012</div></td>

Навожу мышь на этот пункт - линия под ним становится серой. То есть td_hover работает как надо. А вот почему cat2 не на всех пунктах меню срабатывает? Код пункта меню, цвет линии под которым сразу отображается верно:

<td class="cat2" valign="top" ><div onmouseover="this.id='td_hover'" onmouseout="this.id='td_hover2'" class="cat">Пещера БестМебелик</div></td>

Ну то есть форматирование абсолютно одинаковое, а отображается по-разному. Что может на это влиять?

 

[medwoodu]

Да, знаю, что это видно не у всех. Не понимаю почему, у меня и большинства коллег по-прежнему полное совпадение того, что видим, со скриншотом.

Я так понимаю, что суть проблемы в следующем: полоса под некоторыми пунктами меню "Каталог страниц" выводится чёрной, хотя в стилях прописано, что она должна быть серой. Что может быть причиной этому?

Вот код одного из пункта меню страниц:

<td class="cat2" valign="top" ><div onmouseover="this.id='td_hover'" onmouseout="this.id='td_hover2'" class="cat">Каталог 2012</div></td>

Навожу мышь на этот пункт - линия под ним становится серой. То есть td_hover работает как надо. А вот почему cat2 не на всех пунктах меню срабатывает? Код пункта меню, цвет линии под которым сразу отображается верно:

<td class="cat2" valign="top" ><div onmouseover="this.id='td_hover'" onmouseout="this.id='td_hover2'" class="cat">Пещера БестМебелик</div></td>

Ну то есть форматирование абсолютно одинаковое, а отображается по-разному. Что может на это влиять?

а ничего, что на странице все id должны быть уникальными? через классы или на худой конец :hover сделать нельзя?

 

[Neformat]

Думаете, именно одинаковые id влияют на искажение цвета полос в Хроме? Но ведь id одинаковые на всех пунктах меню, а искажения выборочные, причём при обновлении страницы они проявляются постоянно для одних и тех же конкретных пунктов.

Если вместо

<div onmouseover="this.id='td_hover'" onmouseout="this.id='td_hover2'" class="cat">

прописать

<div class="cat">

, то в CSS надо прописывать так:

div.cat:hover {
text-decoration: underline;
}

?

 

[medwoodu]

Думаете, именно одинаковые id влияют на искажение цвета полос в Хроме? Но ведь id одинаковые на всех пунктах меню, а искажения выборочные, причём при обновлении страницы они проявляются постоянно для одних и тех же конкретных пунктов.

Если вместо

<div onmouseover="this.id='td_hover'" onmouseout="this.id='td_hover2'" class="cat">

прописать

<div class="cat">

, то в CSS надо прописывать так:

div.cat:hover {
text-decoration: underline;
}

?

шито?

я думал border-bottom: 1px solid #цвет;

 

[Neformat]

Я имел в виду - стиль должен быть поименован как "div.cat:hover"? Впрочем, с этим я уже разобрался.

Проблема остаётся даже без одинаковых id, всё прописано в классах. И обнаружен новый симптом: если масштаб просмотра страницы изменить со 100% на больше или меньше, то чёрные линии превращаются в правильные, серые. При возврате к 100% снова становятся чёрными.

 

[Юрчик]

• Может так попробуй.
• .cat2 { font-family: Arial, Helvetica, sans-serif;
• font-size: 11px;
• color: grey;}

 

[Neformat]

Спасибо всем. Таки был косяк в коде - лишний <a> внутри <div>'а с onClick.