плавающие блоки и clear:both - SEO форум MaulTalk.com

Сообщение сайта

(Сообщение закроется через 3 секунды)

Здравствуйте, гость (

| Вход | Регистрация )

SEO форум MaulTalk.com > Веб-строительство > Программная часть

плавающие блоки и clear:both

Опции

fazanaka

Topic Starter сообщение

26.2.2011, 18:01; Ответить: fazanaka

Сообщение #1

Группа: User
Сообщений: 5
Регистрация: 26.2.2011
Поблагодарили: 0 раз
Репутация:

Есть три дива, плавающий с лева, с права, и блок по середине с контентом, в нем еще 3 шаблона с плавающими блоками размером 200px и правее них блок с margin-left:200px , чтобы очистить все, значит ставлю

, но кокраз таки это действие заставляет растянуть Шаблон 1 (прикрепил рис.) до плавающего блока с лева! В общем нужно что бы шаблон 1 отображадся как 2й и 3й и не растягивался!
[attachment=37535:float.gif]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>a a a a a a a a a a a a a a a a</title>
<style type="text/css">
* {
padding:0;
margin:0;
}
</style>
</head>

<body>
<div>
<div style="float:right; width:210px; border:1px blue solid;">
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
</div>
<div style="float:left; width:210px; border:1px red solid;">
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
a<br>
</div>
<div style="margin:0 210px;">
<div style="border:5px red solid; margin-bottom:20px;">
<div style="border:3px purple solid;">Шаблон 1</div>
<div style="border:1px fuchsia solid;">
<div style="width:200px; float:left; border:1px olive solid;">Пла<br>ва<br>ющий <br>блок</div>
<div style="margin-left:200px; border:1px maroon solid;">Соо<br>бще<br>ние</div>
<div style="clear:both;"></div>
<div style="border:1px aqua solid;">Нижний блок</div>
</div>
</div>
<div style="border:5px orange solid; margin-bottom:20px;">
<div style="border:3px purple solid;">Шаблон 2</div>
<div style="border:1px fuchsia solid;">
<div style="width:200px; float:left; border:1px olive solid;">Пла<br>ва<br>ющий <br>блок</div>
<div style="margin-left:200px; border:1px maroon solid;">Соо<br>бще<br>ние</div>
<div style="clear:both;"></div>
<div style="border:1px aqua solid;">Нижний блок</div>
</div>
</div>
<div style="border:5px yellow solid; margin-bottom:20px;">
<div style="border:3px purple solid;">Шаблон 3</div>
<div style="border:1px fuchsia solid;">
<div style="width:200px; float:left; border:1px olive solid;">Пла<br>ва<br>ющий <br>блок</div>
<div style="margin-left:200px; border:1px maroon solid;">Соо<br>бще<br>ние</div>
<div style="clear:both;"></div>
<div style="border:1px aqua solid;">Нижний блок</div>
</div>
</div>
</div>
</div>
</body>
</html>

Ответить с цитированием данного сообщения

alexdrob alexdrob 26.2.2011, 18:13; Сообщений: 6488 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	26.2.2011, 18:13; Ответить: alexdrob Сообщение #2
0 Группа: User Сообщений: 6488 Регистрация: 8.9.2009 Поблагодарили: 0 раз Репутация: 0	Включите центральный блок в один общий контейнер. А боковые дивы останутся по бокам. Хотя у вас и так они в общем, просто уберите <div style="clear:both;"></div> Зачем вы это вставили? что значит очистить? Это не очистка а указывает что данный блок будет идти ниже блоков с позиционированием float

fazanaka Topic Starter fazanakaTopic Starter 26.2.2011, 20:14; Сообщений: 5 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	Topic Starter 26.2.2011, 20:14; Ответить: fazanaka Сообщение #3
0 Группа: User Сообщений: 5 Регистрация: 26.2.2011 Поблагодарили: 0 раз Репутация: 0	(alexdrob @ 26.2.2011, 20:13) что значит очистить? очистить обтекание блока, если я это не сделаю то "нижний блок" будет поверх "плавающего" И центральный блок у меня и так вроде как в общем контейнере с внешним отступом с права и лева в 210 px

alexdrob alexdrob 26.2.2011, 20:25; Сообщений: 6488 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	26.2.2011, 20:25; Ответить: alexdrob Сообщение #4
0 Группа: User Сообщений: 6488 Регистрация: 8.9.2009 Поблагодарили: 0 раз Репутация: 0	то есть вам нужно чтобы блок шаблон 2 был ниже плавающих? и будет пустое место между блоком шаблон 1 и шаблон 2? тогда просто перенесите style="clear:both;" из 51 строки в 55ую

fazanaka Topic Starter fazanakaTopic Starter 26.2.2011, 20:46; Сообщений: 5 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	Topic Starter 26.2.2011, 20:46; Ответить: fazanaka Сообщение #5
0 Группа: User Сообщений: 5 Регистрация: 26.2.2011 Поблагодарили: 0 раз Репутация: 0	нет, у шаблонов 1 , 2 , 3 - одинаковый код! по идее 1й должен выглядить как 2й и 3й! дело в том что 1й шаблон браузер растягивает по высоте плавающих блоков которые справа и слева

fazanaka Topic Starter fazanakaTopic Starter 3.3.2011, 13:01; Сообщений: 5 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	Topic Starter 3.3.2011, 13:01; Ответить: fazanaka Сообщение #6
0 Группа: User Сообщений: 5 Регистрация: 26.2.2011 Поблагодарили: 0 раз Репутация: 0	Никто не знает в чем тут дело ???? :(

fazanaka Topic Starter fazanakaTopic Starter 7.3.2011, 9:25; Сообщений: 5 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	Topic Starter 7.3.2011, 9:25; Ответить: fazanaka Сообщение #7
0 Группа: User Сообщений: 5 Регистрация: 26.2.2011 Поблагодарили: 0 раз Репутация: 0	Спасибо всем ! В центральном диве надо поставить overflow: hidden; а в ie height:1% или zoom:1

fgdsryat

26.10.2012, 8:19; Ответить: fgdsryat

Сообщение #8

Группа: User
Сообщений: 3
Регистрация: 25.10.2012
Поблагодарили: 0 раз
Репутация:

спасибо, тоже искал

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой

или обратитесь к любому из модераторов.

« Предыдущая тема · Программная часть · Следующая тема »

1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)

Пользователей: 0

Похожие темы

Тема	Ответов	Автор	Просмотров	Последний ответ
Продам места под сквозные блоки на СМИ сайте текст или графика	0	seo_vladimir	785	2.9.2020, 12:14 автор: seo_vladimir
Не могу выровнять блоки по правую сторону	1	Dark_Delphin	5908	18.11.2016, 0:14 автор: -Петр Чирнов-
При уменьшении масштаба разъезжаются блоки	0	Alex.Bulgakov	3512	9.11.2016, 15:28 автор: -Alex.Bulgakov-
Как поднять блоки вверх	2	Denis_sf	12870	21.11.2013, 22:32 автор: -hennessy-
Сайт расползается на блоки при смене размера шрифта	3	datenrettung	5630	26.2.2013, 22:16 автор: -Arks-

Режим отображения: Стандартный · Переключить на: Линейный · Переключить на: Древовидный

Подписка на тему · Сообщить другу · Версия для печати · Подписка на этот форум

Текстовая версия

Сейчас: 19.4.2024, 1:41

Дизайн