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


Автор: supervladislav 20.5.2009, 06:18
подскажите почему появляется лишние пространство в таблице 
Код

<table cellpadding="0" cellspacing="0" align="center"  width="60%"  border="0">
<tr valign="top">
<td align="left">Оборот:</td>
<td align="left">Прибыль:</td>

</tr>
<tr bgcolor="#1FBE19">
<td align="center">1 </td>

<td align="center">2 </td>
</tr>
<tr valign="top">
<td colspan=2 align="center">
<div style="position:relative;top:0px;left:275px; display:block;"><img src="img/1000.png" width="100px" height="189px"> </div>
<div style="position:relative;top:-130px;left:170px;display:block;"><img src="img/120.png" width="100px" height="189px"> </div>
<div style="position:relative;top:-240px;left:60px;display:block;"><img src="img/30.png" width="100px" height="189px"> </div>
<div style="position:relative;top:-350px;left:-50px;display:block;"><img src="img/15.png" width="100px" height="189px"> </div>
<div style="position:relative;top:-470px;left:-170px;display:block;"><img src="img/10.png" width="100px" height="189px"> </div>

<tr>
<td colspan="6" align="right"><form action="" method="post"><input type=text maxlength="7" name="vivid"/><input type="submit" value="перевести"></form></td>
</tr>
<tr>
</td>
<tr>

</table>

Автор: ksnk 20.5.2009, 07:59
Может потому, что таблица разрушена? Нужно  чтобы количество ячеек в каждой строке с учетом colspan'ов было равно. Для исправления "грязной" таблицы хорошо подходит ДримВейвер. 

Автор: supervladislav 20.5.2009, 09:34
вроде исправил но ничего не изменилось 
Код

<table cellpadding="0" cellspacing="0" align="center"  width="60%"  border="0">
<tr valign="top">
<td align="left">Оборот:</td>
<td align="left">Прибыль:</td>

</tr>
<tr bgcolor="#1FBE19">
<td align="center">1 </td>

<td align="center">2 </td>
</tr>
<tr valign="top">
<td colspan=2 align="center">
<div style="position:relative;top:0px;left:275px; display:block;"><img src="img/1000.png" width="100px" height="189px"> </div>
<div style="position:relative;top:-130px;left:170px;display:block;"><img src="img/120.png" width="100px" height="189px"> </div>
<div style="position:relative;top:-240px;left:60px;display:block;"><img src="img/30.png" width="100px" height="189px"> </div>
<div style="position:relative;top:-350px;left:-50px;display:block;"><img src="img/15.png" width="100px" height="189px"> </div>
<div style="position:relative;top:-470px;left:-170px;display:block;"><img src="img/10.png" width="100px" height="189px"> </div>

</td>
</tr>
<tr>
<td colspan="2" align="right"><form action="" method="post"><input type=text maxlength="7" name="vivid"/><input type="submit" value="перевести"></form></td>
</tr>




</table>

Автор: Veve 20.5.2009, 09:47
О каком лишнем пространстве идёт речь, можно уточнить? 

Автор: supervladislav 20.5.2009, 10:10
речь идёт о нижнем пространстве )))появляется ниже картинок  и кнопкой ,тоесть в той ячейке где дивы

Автор: ksnk 20.5.2009, 10:25
Позиционировать релятивами, да еще и при центрировании - это эквилибристика, результаты которой мы и видим smile

Код

<td align="center" colspan="2">
<div style="position: relative; top: 0 ...

Вот такое нужно заменить на 
Код

<td align="center" colspan="2">
<div style="height:700px; position:relative;">
<div style="position: absolute; width:100px; height:100px; top: ... left: ...">...</div>
...
</div>
</td>

основной смысл - окружаем картинки div с position:relative; Все картинки вставляем с уже установленными размерами, top-left (можно в процентах) и position:absolute...

Автор: supervladislav 20.5.2009, 13:00
спасибо а какнить без height 700

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