Jump to content
  • 0

Див под дивом . Как автоматизировать ?


dima4321
 Share

Question

Всем привет !!! ))

Значит делаю дивы блоками один за другим по правой стороне

Вот код css

.block1 { width: 200px;

background: #fc0;

padding: 5px;

border: solid 1px black;

font-size: 12pt ;

font-family: Verdana;

font-style:normal;

font-weight:bold;

text-decoration:none;

float: right;

.block2 { width: 300px;

background: #FFF5EE;

padding: 5px;

border: solid 1px black;

font-size: 10pt ;

font-family: Verdana;

font-style:normal;

font-weight:bold;

text-decoration:none;

position: relative;

top: 540px;

left: 212px;

float: right; }

А теперь вопрос.

1.Мне никак не подогнать правую сторону в IE . Чтобы они красиво были выравнены по правой стороне. пришлось выставить параметр left -212.... но это ведь колхоз должна же быть автоматизация.??

2. То же самое как понять воторому блоку где конец первого ?? чтобы он шел сразу за ним например или с отступом на 10 мм ниже. Мне пришлось выставить значение top 540. Но ведь длина блока у меня разная . И соответственно 540 только для данного случая..а при другом тексте не прокатит... Есть автоматизация.???

Link to comment
Share on other sites

6 answers to this question

Recommended Posts

  • 0
Всем привет !!! ))

Значит делаю дивы блоками один за другим по правой стороне

Вот код css

А теперь вопрос.

1.Мне никак не подогнать правую сторону в IE . Чтобы они красиво были выравнены по правой стороне. пришлось выставить параметр left -212.... но это ведь колхоз должна же быть автоматизация.??

2. То же самое как понять воторому блоку где конец первого ?? чтобы он шел сразу за ним например или с отступом на 10 мм ниже. Мне пришлось выставить значение top 540. Но ведь длина блока у меня разная . И соответственно 540 только для данного случая..а при другом тексте не прокатит... Есть автоматизация.???

Верхнему блоку поставь clear: both;

Link to comment
Share on other sites

  • 0

.block1 { width: 200px;

background: #fc0;

padding: 5px;

border: solid 1px black;

font-size: 12pt ;

font-family: Verdana;

font-style:normal;

font-weight:bold;

text-decoration:none;

float: right;

clear: both;

}

.block2 { width: 300px;

background: #FFF5EE;

padding: 5px;

border: solid 1px black;

font-size: 10pt ;

font-family: Verdana;

font-style:normal;

font-weight:bold;

text-decoration:none;

float: right; }

Размещает второй блок слева от первого !! А не ниже как хотелось бы ...

Ты напутал или я ??

Edited by dima4321
Link to comment
Share on other sites

  • 0

а... на самом деле надо было во второй блок засунуть вот так

.block2 { width: 300px;

background: #FFF5EE;

padding: 5px;

border: solid 1px black;

font-size: 10pt ;

font-family: Verdana;

font-style:normal;

font-weight:bold;

text-decoration:none;

float: right;

clear: right;

А что слева от этих блоков?

а слева до хрена текста

Link to comment
Share on other sites

  • 0
а... на самом деле надо было во второй блок засунуть вот так

.block2 { width: 300px;

background: #FFF5EE;

padding: 5px;

border: solid 1px black;

font-size: 10pt ;

font-family: Verdana;

font-style:normal;

font-weight:bold;

text-decoration:none;

float: right;

clear: right;

а слева до хрена текста

Давай скрин того, что хочешь получить

Edited by psywalker
Link to comment
Share on other sites

  • 0
Давай скрин того, что хочешь получить

Дык я получил )) Все получилось. Вот код.

Я ж написал

.block1 { width: 200px;

background: #fc0;

padding: 5px;

border: solid 1px black;

font-size: 12pt ;

font-family: Verdana;

font-style:normal;

font-weight:bold;

text-decoration:none;

float: right;

.block2 { width: 300px;

background: #FFF5EE;

padding: 5px;

border: solid 1px black;

font-size: 10pt ;

font-family: Verdana;

font-style:normal;

font-weight:bold;

text-decoration:none;

position: relative;

top: 40px;

float: right;

clear: right;

}

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy