Перейти к содержанию
Форум поддержки пользователей VamShop

Положение картинки товара


Рекомендуемые сообщения

Никак не могу изменить положение картинки товара в  файле new_products_default.html. То есть я сделал рамку для картинки. Добавил в таблицу стилей картинку background:

dt.itemImage

  {   

  background: url(img/shopos/bg_image.png);

  margin: 0 0 0 0;

  padding: 2px 5px 0 5px;

  text-align: center;

  background-repeat:no-repeat;

  background-position:center;

  position: relative;

  overflow:hidden;

  width:220px;

  height:220px;

  }

Код вывода товара в файле new_products_default.html:

<a href="{$module_data.PRODUCTS_LINK}">{$module_data.PRODUCTS_NAME}</a> <br />

<dt class="itemImage"> {if $module_data.PRODUCTS_IMAGE} <a href="{$module_data.PRODUCTS_LINK}"><img src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" border="0" title="{$module_data.PRODUCTS_NAME}" /></a></dt><br />

{$module_data.PRODUCTS_SHORT_DESCRIPTION|vam_truncate:$smarty.const.MAX_DISPLAY_SHORT_DESCRIPTION:"...":true}<br />

Цена:{$module_data.PRODUCTS_PRICE}<br />

<a href="{$module_data.PRODUCTS_LINK}">Подробнее</a>

shop.png

Картинка товара относительно рамки смещена вверх, у самой верхней границы, а мне надо сделать в центре, так как картинки разные по высоте. СSS знаю слабо.  Пробовал вставлять в таблицу и там центрировать-не помогает. Подскажите плиз, как можно отцентрировать картинку:

Ссылка на сообщение
Поделиться на другие сайты

Если у Вас height фиксированный, то можно примерно рассчитать отступ, т.е. можно например через padding-top: 10px; к примеру, либо через top: 10px;

Ссылка на сообщение
Поделиться на другие сайты

Да, но так опускаются все картинки. Мне необходимо картинку вставить в центре рамки, поскольку высота картинок разная. В данном случае,  картинки с небольшой высотой можно опустить к центру, но в это время большие картинки уйдут вниз. Можно, конечно переделать все картинки на одинаковый размер. Но может все таки существует возможность отцентрировать картинку в рамке?

shop1.png

Ссылка на сообщение
Поделиться на другие сайты

Решил немного по другому. Сделал таблицу непосредственно в new_products_default.html. Прописал там background. Получилось так:

shop2.png

Насколько правомочно такое решение?

Ссылка на сообщение
Поделиться на другие сайты
×
×
  • Создать...