Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 06.05.2010, 03:13   #1
boget
Пользователь
 
Аватар для boget
 
Регистрация: 06.05.2010
Сообщений: 10
Сообщение Позиционирование блоков и обтекание

Вот код, который получается на данный момент:
<div style="margin-top:187px; margin-left: 58px; width: 206px; height: 70px; background:#9F6; position:relative;">
<div style="float:left; width: 50px; height:19px;"></div><div style="float:right; width: 50px; height:19px; background:#C06; vertical-align:bottom; bottom:0px;"></div>
текст текст текст текст текст текст текст текст текст текст текст текст
</div>

Отображение на выходе:

Как сделать, чтоб красный квадратик был в правом нижнем углу зеленого квадратика и чтоб его сверху и слева обтекал текст?
Изображения
Тип файла: jpg 01.jpg (18.8 Кб, 75 просмотров)
boget вне форума Ответить с цитированием
Старый 06.05.2010, 10:14   #2
MrJenika
Форумчанин
 
Аватар для MrJenika
 
Регистрация: 07.09.2009
Сообщений: 361
По умолчанию

просто поменяйте местами блоки с текстом и квадратиком
Код:
<div style="margin-top:187px; margin-left: 58px;
 width: 206px; height: 70px; background:#9F6; position:relative;">
текст текст текст текст текст текст текст текст
 текст текст текст текст
<div style="float:left; width: 50px; height:19px;"></div><div style="float:right; width: 50px; height:19px; 

background:#C06; vertical-align:bottom; bottom:0px;"></div>
</div>
MrJenika вне форума Ответить с цитированием
Старый 06.05.2010, 12:57   #3
boget
Пользователь
 
Аватар для boget
 
Регистрация: 06.05.2010
Сообщений: 10
По умолчанию

Если поменять местами, то зеленый из левого верхнего угла съезжает в левый нижний угол, а красный так же при появлении новых строк съезжает вниз, а хотелось бы, чтоб его текст обтекал слева при появлении новых строк. Например, если увеличить высоту до 40px, то получится:
Изображения
Тип файла: jpg 01.jpg (19.4 Кб, 61 просмотров)
boget вне форума Ответить с цитированием
Старый 06.05.2010, 13:28   #4
MrJenika
Форумчанин
 
Аватар для MrJenika
 
Регистрация: 07.09.2009
Сообщений: 361
По умолчанию

так вы не задавайте высоту блока и тогда он будет тянуться на всё содержимое. То есть уберите height: 70px;
MrJenika вне форума Ответить с цитированием
Старый 06.05.2010, 14:18   #5
boget
Пользователь
 
Аватар для boget
 
Регистрация: 06.05.2010
Сообщений: 10
Вопрос

Если не задавать, то все равно текст не обтекает красный блок слева. Для наглядности увеличил высоту красного блока до 40px и левый блок синим сделал:

код:
<div style="margin-top:187px; margin-left: 58px;
width: 206px; background:#9F6; position:relative;">
<div style="float:left; width: 50px; height:40px; background:#06F;"></div>
текст текст текст текст текст текст текст текст
текст текст текст текст

<div style="float:right; width: 50px; height:40px; background:#C06; vertical-align:bottom; bottom:0px;"></div>
</div>
boget вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
CSS позиционирование блоков klyne HTML и CSS 7 30.04.2010 12:45
Позиционирование Syltan HTML и CSS 0 25.03.2010 19:15
Позиционирование serg_sk HTML и CSS 0 18.03.2010 20:42
Фиксированное позиционирование блоков. Андрей79 HTML и CSS 0 17.08.2009 11:50
Позиционирование каретки Spice Win Api 1 25.03.2009 04:51