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


Автор: April 16.2.2007, 00:10
Когда смотришь в полностью открытом окне на страницу в ИЕ - всё нормально.
Как только изменяю размер окна, нажав "свернуть", то див и таблица с картинкой внутри, сьезжают вниз.

Код

<html>
<head>
<style>
.block1 { width:100% ; height: 84px; background: lightblue; padding: 5px;  border: solid 1px black; clear: both;}
.block2 { width: 120px; border-width:3px; color:red;  background: silver; padding: 5px; }

</style>
</head>
<body bgcolor="lightgreen">
<table border="2" width="60%" align="center" height="100%">
<tr><td>
<div class="block1" align="center"><h2>КВН-team "Зажигалка"</h2></div>
<div style='background-color: lightblue; 
            width: 120px; 
            height: 570px; 
            border-style: solid;
            border-width: 1px;
            border-color: black;
            float: left;
            '>   
<a class='block2' href='#'><center>Главная</center></a>
<a class='block2' href='#'><center>Команда</center></a>
<a class='block2' href='#'><center>Наши шутки</center></a>
<a class='block2' href='#'><center>Фото</center></a>
<a class='block2' href='#'><center>Видео</center></a>


</div>

<div style="background-color: lightblue; 
            width: 533px; 
            height: 570px; 
            float: left;">
             

<table border="1" align="left">
<tr><td>
<img src="44.jpg"></td></tr>
</table>  
</div>

</td>
</tr>
</table>
</body>
</html>



Автор: DEER 16.2.2007, 15:31
как я понял должно быть так
Код

<html>
<head>
<style>
.block1 { width:100% ; height: 84px; background: lightblue; padding: 5px;  border: solid 1px black; clear: both;}
.block2 { width: 120px; border-width:3px; color:red;  background: silver; padding: 5px; }

</style>
</head>
<body bgcolor="lightgreen">
<table border="2" width="60%" align="center" height="100%">
<tr><td colspan=2>
<div class="block1" align="center"><h2>КВН-team "Зажигалка"</h2></div>
</td>
</tr> 
<tr><td>
<div style='background-color: lightblue; 
            width: 120px; 
            height: 570px; 
            border-style: solid;
            border-width: 1px;
            border-color: black;
            float: left;
            '>  
<a class='block2' href='#'><center>Главная</center></a>
<a class='block2' href='#'><center>Команда</center></a>
<a class='block2' href='#'><center>Наши шутки</center></a>
<a class='block2' href='#'><center>Фото</center></a>
<a class='block2' href='#'><center>Видео</center></a>


</div>
</td>
<td>
<div style="background-color: lightblue; 
            width: 533px; 
            height: 570px; 
            float: left;">
             

<table border="1" align="left">
<tr><td>
<img src="44.jpg"></td></tr>
</table>  
</div>
</td>
</tr>


</table>
</body>
</html>


Зачем так многа дивов?

Автор: April 16.2.2007, 16:23
Да, всё работает спасибо.
Цитата

Зачем так многа дивов?


А как можно по другому сделать?

Автор: DEER 16.2.2007, 17:39
ну елемент <td></td> это уже область. а ты в неё ещё и div суешь
типа избыточность, что ли получается.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)