margin-top и margin-bottom

cx717 · October 11, 2007

Вопрос явно простой, искал ответ во всей сети - ненашел,

Есть таблица с двумя строками и двумя рядами: верхняя строка - одна ячейка (colspan="2"),

нижняя строка состоит из двух ячеек.

В верхней строке-ячейке лежит jpeg, в правой-нижней ячейке - текст, а в левой-нижней

с помощью div'а размещается gif:

<html>
<head>
 <title>test margin</title>
</head>
 <body>

 <table align="center" bgcolor="#d7d7d8" border="1">
 <tr>
 <td colspan="2">
 <div style="margin-top:0px;">
 <img src="" width="200" height="100">
 </div>
 </td>
 </tr>
 <tr>
 <td>
 <div style="margin-top:0px;">
 <img src="" width="100" height="100">
 </div>
 </td>
 <td>
 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 </td>
 </tr>
 </table>

 </body>
</html>

Если в div'e указать margin-top:0px div всеравно располагается посередине высоты ячейки.

Если в div'e указать margin-bottom:300px , то div (как бы прижимаясь снизу margin-bottom'ом) поднимается.

Получается, margin-top ниже приоритетом (точнее вообще не работает при малых величинах) margin-bottom'а.

В FF и IE история одинаковая. Подскажите, плз, в чем ошибка.

ссылка на файл: http://www.daiquiri.spb.ru/2.html

Scrum · October 11, 2007

а чего добиться то хочешь ?

cx717 · October 11, 2007

Картинку в левой-нижней ячейке заменю на флешку, а она (флешка) должна быть притянута к верхнему краю.

Абсолютное позиционирование не подходит - таблица должна быть по центру страницы.

..> вставлял - та же проблема (margin-top не работает)

Scrum · October 11, 2007

cx717 · October 11, 2007

Scrum, я прописал

в ячейку с дивом:

<td valign="top">
 <div style="margin-top:200px;">margin-top:0px

 <img src="" width="100" height="100">
 </div>
 </td>

Ничего не изменилось. Можно по подробнее плз.

Scrum · October 11, 2007

<html>
<head>
 <title>test margin</title>
</head>
 <body>

 <table align="center" bgcolor="#d7d7d8" border="1">
 <tr>
 <td colspan="2">
 <div>
 <img src="" width="200" height="100">
 </div>
 </td>
 </tr>
 <tr>
 <td valign="top">
 <div>
 <img src="" width="100" height="100">
 </div>
 </td>
 <td>
 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 текст


 </td>
 </tr>
 </table>

 </body>
</html>

cx717 · October 11, 2007

Большое спасибо, Scrum, все заработало.

Sign In

margin-top и margin-bottom

Question

cx717

Link to comment

Share on other sites

6 answers to this question

Recommended Posts

Scrum

Link to comment

Share on other sites

cx717

Link to comment

Share on other sites

Scrum

Link to comment

Share on other sites

cx717

Link to comment

Share on other sites

Scrum

Link to comment

Share on other sites

cx717

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information