Текст наезжает на картинку в Google Chrome

[Freeman Liberty]

Вот приобрел забугорный шаблон для OpenCart от солидной (вроде бы) фирмы, но в процессе работы повылазила масса багов. Большую часть сам поправил, но некоторые осилить никак не удается.
Например, в корзине покупок, название товара наезжает на изображение товара, причем такая ситуация только в Google Chrome.

Просмотрел css, но так и не нашел причину.
Сравнил с другими шаблонами той же конторы, в которых все отображает нормально - значимых различий в css и разметке не обнаружил.
Проблемный шаблон:
Для просмотра ссылки Войди или Зарегистрируйся
Шаблон с нормальной корзиной:
Для просмотра ссылки Войди или Зарегистрируйся
Буду признателен за помощь.

P.S.
Вообще-то, помогает увеличение min-width до 350px, но что-то подсказывает, что это не совсем верное решение.

 

[ivan.petrov]

img {
  border: 0 none;
  height: auto;
  max-width: 100%; 
  vertical-align: middle;
}

Без max-width становится все нормально. Другой вопрос для чего оно добавлено и на что повлияет если убрать.

 

[Freeman Liberty]

Дизайн адаптивный, возможно, потому и добавлено.
Если закомментировать max-width, а потом уменьшит размер окна до планшетного, то корзина совсем разъезжается.

 

[codeator]

<a href та которая в <td class=image дайте ей что-то типа display: inline-block; width: 80px; height: 80px;

проблема как мне кажется в том, что ширина и высота td с картинкой нулевая, так как вложено в ссылку которая размер картинки не учитывает

 

[ivan.petrov]

проблема как мне кажется в том, что ширина и высота td с картинкой нулевая, так как вложено в ссылку которая размер картинки не учитывает

Ваше предложение это пример как делать не надо. Инлайновые стили это г-но код.

Ширина и высота нулевая это как раз следствие, это баг хрома. Из за max-width: 100%; при не заданном или неизвестном размере контейнера (ссылки в данном случае), он не может рассчитать размеры.

 

[codeator]

Уважаемый господин Иван Петров - я постарался максимально помочь вам и отразить изменения в коде так, чтобы вам было максимально понятно, я ведь не буду прикладывать вам CSS файл, а вы не будете смотреть дифф-мерж, верно? Я понадяелся на вашу сообразительность, и думал что вы догадаетесь сами поместить стили туда, куда необходимо, будь то less или css или sass - поскольку я не вдаюсь в подробности как именно вы предпочитаете писать-компилировать css, когда моя скромная роль была всего-лишь попытаться помочь и донести до вас суть максимально эффективно - с помощью понятных всем инлайн стилей. Конечно, инлайн стили это плохо, я не призываю их писать ничуть, и пример мой ни в коей мере не об инлайне, а о том на какие элементы что повесить, чтобы обойти баги хрома и прочие узкие моменты. Я думал вы сообразительнее и догадаетесь об этом сами =)

Из за max-width: 100%; при не заданном или неизвестном размере контейнера (ссылки в данном случае), он не может рассчитать размеры. - я вам и посоветовал по сути задать размер контейнера =)