Эта проблема немного странная (так как мне нужно это сделать, так как я не нашел другого подходящего способа).
У меня есть три блока внутри «большого блока».
Главный div называется:
<div class="produtos-item">
И внутри этого div у меня есть еще три div
<div class="item">
Так что мне нужно?
Представьте себе магазин (электронная коммерция). У меня 3 товара (шт.).
PRODUCT-1 PRODUCT-2 PRODUCT-3
------------------------------
THIS LINE
PRODUCT-4 PRODUCT-5 PRODUCT-6
Мне нужно вставить строку между div. НО, если я установлю div .item без высоты, макет сломается. Смотрите скриншот.
Как видите, этот черный кружок был продуктом. Но поскольку фиксированной высоты нет, и я не могу ее установить (потому что заголовок может быть больше), макет сломается. Если я могу "вызвать" главный div (produtos-item), я могу исправить это.
Вы знаете какое-нибудь решение? :(
JSFiddle: http://jsfiddle.net/WRGba/ [отредактировано 10 мая]
1 ответ
Попробуйте поставить на них display:inline-block; (zoom:1;*display:inline; для совместимости с IE6, IE7)
Кроме того, jsFiddle не повредит!
Используя пример @ Shebo сверху:
Не рабочий пример: jsFiddle
Рабочий пример: jsFiddle
#produtos { width: 575px; float: left; margin: 0px 25px; } #produtos .item { width: 170px; float: left; margin-right: 10px; margin-left: 10px; display:inline-block; zoom:1; *display:inline; }