Странная проблема рендеринга Chrome. Возможная ошибка?

Question

Наш веб-сайт , в Chrome три ячейки с правой стороны заголовка загадочным образом сдвинуты на 5 пикселей вниз. Обратите внимание на границы между корзиной, «поделиться» и «делать покупки всех брендов» и как они распространяются ниже плоскости.

Страница выглядит нормально в других браузерах, таких как Firefox и IE.

Я потратил довольно много времени, пытаясь выяснить, что является причиной того, что вещи в Chrome сбрасываются. У меня есть основания подозревать, что это как-то связано с <div> в «магазине всех брендов» <td>.

Также интересно отметить, что в более новой бета-версии Chrome страница отображается без этого странного поведения? Может быть, ошибка была исправлена?

Answer 1

Для DIV с парой a.shopallbrands, имеющей встроенный стиль style="margin:0 0 0 10px;", измените его следующим образом: style="margin:0 0 0 10px; height: 19px;".

Answer 2

Удаление <div>, окружающего «Shop All Brands», привело к исчезновению проблемы. Очевидно, что Chrome любит добавлять лишние интервалы, когда <div> содержится в ячейке таблицы в этом конкретном контексте. Опять же, как я упоминал ранее, такого поведения нет в более новых (бета) версиях Chrome.

Answer 3

Похоже, что где-то может быть дополнительный отступ.Попробуйте установить padding:0 на td, который охватывает каждый элемент.