Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > зафиксировать высоту ячейки таблицы

Автор: Johny_03 5.8.2008, 23:52

Всем привет!
Подскажите пожалуйста, как мне можно зафиксировать высоту ячейки_1? я задал высоту 150px, но когда ячейка_2 наполняется, то ячейка_1 расстягивается больше нужного. А мне нужно, чтоб ячейка_1 была фиксированной, а ячейка_4 растягивалась на остальное

Код


<html>
    <body>
<table border=1 width=100%>
    <tr valign="top">
        <td width=220 height=150>ячейка_1
        </td>
      <td rowspan=2>ячейка_2
        <br><br><br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br><br><br>
      </td>
      <td rowspan=2 width=18%>ячейка_3
      </td>
    </tr>
    <tr valign="top">
        <td>ячейка_4
        </td>
    </tr>
</table>
</body>
</html>

Заранее огромное спасибо!

Автор: webster 6.8.2008, 02:00

Высоту можно зафиксировать только если и для нижней ячейки (ячейка_4) определить какое-либо значение высоты, но в таком случае каркас таблицы уже тянуться не будет по высоте и контент, при переполнении ячеек будет "вываливаться" за пределы ячейки.
Можно вложить в первую колонку таблицы div фиксированной высоты, и не использовать две строки таблицы.

Автор: Gold Dragon 6.8.2008, 08:01

я бы предложил такую структуру, думаю смысл понятен

Код


<table border=1 width=100%>
    <tr valign="top">
        <td width=220>
            <table border="1" width="100%">
                <tr>
                    <td height="150">1</td>
                </tr>
            </table>
            <table border="1" width="100%">
                <tr>
                    <td>2</td>
                </tr>
            </table>
        </td>
        <td>3</td>
        <td>4</td>
    </tr>
</table>

но отказался бы вообще использовать height в таблице. Не рекомендовано спецификацией и нет гарантии что это не перестанут поддерживать новые браузеры. Лично я для этой цели использую прозрачную Гифку.

Автор: krundetz 6.8.2008, 08:26

Насколько я понял то нужно получить ячейку таблицы ограниченую по высоте.
Для этого берешь и задаешь ей через CSS высоту такую какую надо, далее прописываешь такое свойство

Код


overflow: hidden;

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

Автор: NDenis 6.8.2008, 08:48

krundetz, вы забыли упомянуть, что при таком правиле, переполняемый контент будет обрезаться smile

Автор: Johny_03 6.8.2008, 09:02

Цитата(krundetz @ 6.8.2008, 08:26

)

overflow: hidden;

Объясни плиз, что куда писать. что в css а что в body? Просто я с таким ещё не сталкивался
Спасибо

Автор: Gold Dragon 6.8.2008, 09:36

всё пиши в стили.. Это правильно будет

Автор: krundetz 6.8.2008, 15:25

Johny_03, все оформление выноси в стили в HTML оставляй только структуру

NDenis, совершенно верно обрежится

Автор: Johny_03 10.8.2008, 15:59

Я решил немного поменять структуру. Подскажите как зафиксировать высоту самой нижней ячейки на странице? чё-то ничего не помагает.

Автор: Ctulhy 10.8.2008, 19:18

Самой нижней ячейки или таблицы? Ну помоему так же. Я бы сделал через прозрачный гиф или хотя бы через высоту таблицы. Покажи код страницы.

Автор: Gold Dragon 11.8.2008, 11:21

Цитата(Ctulhy @ 10.8.2008, 20:18

)

или хотя бы через высоту таблицы

Не рекомендуется спецификацией..

Автор: Johny_03 11.8.2008, 11:49

Вот код. Мне нужно зафиксировать ячейку_4, сделаь её 40px

Код


 <table border=0 bgcolor="#D4E6F1" width=100% align="center">
    <tr align="center" valign="top">
        <td bgcolor="D4E6F1" width=220 style="padding-top: 300" rowspan=2>
            ячейка_1
        </td>
        <td bgcolor="#ffffff" valign="top" align="center">
      ячейка_2
        </td>
        <td width=18% rowspan=2 align="center">
            ячейка_3
        </td>
    </tr>
    <tr align="center">
        <td bgcolor="#ffffff"><br>
         ячейка_4
        </td>
    </tr>
 </table>

Автор: Gold Dragon 11.8.2008, 11:55

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

Автор: Johny_03 11.8.2008, 17:47

Дело в том, что у меня там будет надпись, а прозрачная гифка не работает, т.к. у меня в опере по умолчанию высота ячейки почему-то очень большая, а гифка естественно меньше и она роли не играет.

Автор: Gold Dragon 12.8.2008, 07:58

так ты поставь у таблицы cellpadding="0" cellspacing="0"