Уважаемые посоветуйте как проще реализовать следующее:

есть <div1> ширина=600 высота=100
в нем нужно разбить пространство на 6 секций: по порядку <div-a> <div-b>  <div-a> <div-b>  <div-a> <div-b>
А ширина=200 высота=20
В ширина=200 высота=80,
так чтоб В были под А, образовывая тем самым столбик <div-a> + <div-b>, а таких столбиков получается 3





По данному коду: все блоки отображаются по вертикали(вернее текст этих блоков выходит за границы блока-1)
Можно для каждого столба еще див как контейнер сделать и выставить им float но это еще +3 дива(. Или секции бить из списков или span, но тут косяки получаются с эксплоером. Проще сего таблицей), но это же извращение.

Это сообщение отредактировал(а) CmndrAlexGreen - 7.7.2011, 22:54

Похоже?

Возможно)). Щас буду изучать. Спасибо

Почитал. Возникли сомнения насчет полной совместимости с браузерами старого образца, типо ие6, все-таки display: inline-block; как-то им коряво поддерживается.

И имеет ли какое-то значение span'ом ил div'ом делать сами блоки?

Это сообщение отредактировал(а) CmndrAlexGreen - 8.7.2011, 16:42

Настоящие проблемы были только в FF2. У FF3+, Оперы 8+, всех вебкитовых и IE8+ проблем нет, а в IE7- нужное поведение без издержек достигается комбинацией inline + hasLayout (напр. zoom:1). С тех пор, как FF2 потерял актуальность, можно юзать смело.


Я бы делал дивом. Всё-таки, "исконно блочный" элемент в "исконно строчном" — часто искушение для парсера закрыть что-нибудь не там, где надо... ;)