"быстрая" верстка

[Vlad Drakula]

benya

а вот можно... иногда сложно иногда не очень... но можно... конечно полностью всю функциональность таблиц не повторить... но большую часть можно...



если очень интересно могу описать как можно верстать подобные вещи... главное пример конкретный придумай...

[benya]

Vlad Drakula,

Простой (для таблицы) пример "таблица с ценами":

Код: Выделить всё

<table width="100%" border="0" cellpadding="2" cellspacing="1" style="BACKGROUND-COLOR: #cccccc">
                    <tbody>
                    <tr bgcolor="#eeeeee">
                      <td rowspan="2" nowrap="nowrap"><b>Заезды</b></td>
                      <td rowspan="2" nowrap="nowrap"><b>Даты заездов</b></td>
                      <td colspan="2" nowrap="nowrap"><b>Стоимость в грн.</b></td>
                    </tr>
                    <tr bgcolor="#eeeeee">
                      <td nowrap="nowrap"><b>1 день</b></td>
                      <td nowrap="nowrap"><b>20 дней</b></td>
                    </tr>
                    <tr bgcolor="#fefefe">
                      <td>1</td>
                      <td>05.06 – 24.06</td>
                      <td>110</td>
                      <td>2200</td>
                    </tr>
                    <tr bgcolor="#fefefe">
                      <td>2</td>
                      <td>25.06 – 14.07</td>
                      <td>117,5</td>
                      <td>2350</td>
                    </tr>
                    <tr bgcolor="#fefefe">
                      <td>3</td>
                      <td>15.07 – 03.08</td>
                      <td>117,5</td>
                      <td>2350</td>
                    </tr>
                    <tr bgcolor="#fefefe">
                      <td>4</td>
                      <td>04.08 – 23.08</td>
                      <td>117,5</td>
                      <td>2350</td>
                    </tr></tbody></table>

[Vlad Drakula]

benya

постепенно...

для начала самое простое...

строка с танными...



было:





HTML код:

Код: Выделить всё

<tr bgcolor="#fefefe">
  <td>3</td>
  <td>15.07 – 03.08</td>
  <td>117,5</td>
  <td>2350</td>
</tr>

стало:





HTML код:

Код: Выделить всё

<div style="width:100%;position:relative;height:20px;background-color: #fefefe">
			<div style="position:absolute;left:0px:top:0px;width:25%;">3</div>
			<div style="position:absolute;left:25%top:0px;width:25%;">15.07 – 03.08</div>
			<div style="position:absolute;right:25%top:0px;width:25%;">117,5</div>
			<div style="position:absolute;right:0pxtop:0px;width:25%;">2350</div>
		</div>

[Vlad Drakula]

benya

скажу честно, то что я написал, не проверял, писал по памяти, вроде должно работать...




Цитата:



Что X/Y попиксельно выставлять?



иногда приходится... я иногда по 20-30 CSS классов для этого пишу...




Цитата:



А как рамку поставить?



а все сразу хочешь... верстка дивами это зачастую очень сложное занятие... иногда на верстку одного елемента уходит полдня... а если что то сложное верстать то может уйти и неделя... но для меня зачастую просто нету альтернатив... так что приходится...

[benya]

Vlad Drakula,

Наверное много платят ) Можно так и пол года ковыряться. Да ну, по мойму дурная затея...может для простого дизайна и годится.

[Vlad Drakula]

benya

как разтаки... сложный дизайн на таблицах не сделаещь(действительно сложный)... иначе IE просто повиснет...

[benya]

Vlad Drakula,


Цитата:



сложный дизайн на таблицах не сделаещь(действительно сложный).



От того что дивы плавают, а ячейки таблицы нет?




Цитата:



иначе IE просто повиснет...



Это уже другой вопрос. Кстати, часто замечаю что иногда эксплорер замораживается. Особенно если быстро обновить страницу. Приходится его закрывать и открывать новое окно. Не от того ли?

[Vlad Drakula]

benya


Цитата:



Это уже другой вопрос. Кстати, часто замечаю что иногда эксплорер замораживается. Особенно если быстро обновить страницу. Приходится его закрывать и открывать новое окно. Не от того ли?



вполне возможно, я уже создавал тему с примером HTML который заставляет эксплорер сильно задуматься...




Цитата:



От того что дивы плавают, а ячейки таблицы нет?



от того что IE не переваривает таблицы с большой вложенностью...

[benya]

Vlad Drakula,

Ну ок сделали мы так... Что будет если в один из элементов (внутренних ячеек) добавить:





Код:

Код: Выделить всё

<br><br><br><br>end

По сути дивка растянется вниз. А родительская дивка останется на месте. А если она еще и с рамкой то все оказывается и поплыло. Как бороться?

[Vlad Drakula]

benya



или



если возможна такая ситуация, то одну из ячеек можно сделать без обсолютного позиционирования, тогда будет растягиваться вся строка...



или



использовать "overflow:hidden;" чтобы скрывать не влезающий текст.