0 / 0 / 1
Регистрация: 23.01.2013
Сообщений: 11
1

Задаю float:left - не показывает фон родителя

23.01.2013, 19:14. Показов 1361. Ответов 5
Метки нет (Все метки)

Почему когда задаю float: left class'у Block, то у меня не показывает фон wraperr'a?

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<html>
<head>
<title> Johnyboy.ru | Главная </title>
 <link rel="stylesheet" type="text/css" href="style.css"/>
    </head>
 
<body>
<div id="body">
 <div id="header">
 &nbsp;
 </div>
 
 <div id="wrapper">
 <div class="block">
 &nbsp;
 </div>
 <div class="block">
 &nbsp;
 </div>
 <div class="block">
 &nbsp;
 </div>
 <div class="block">
 &nbsp;
 </div>
 <div class="block">
 &nbsp;
 </div>
 <div class="block">
 &nbsp;
 </div>
 <div class="block">
 &nbsp;
 </div>
 <div class="block">
 &nbsp;
 </div>
 <div class="block">
 &nbsp;
 </div>
 <div class="block">
 &nbsp;
 </div>
 </div>
 
 <div id="footer">
 &nbsp;
 </div>
</div>
</body>
</html>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
body
{
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#669999), color-stop(100%,#336666));
clear:both;
}
 
#body
{
width:1000px;
background:white;
margin:0 auto;
padding:10px;
-webkit-border-radius: 10px;
clear:both;
}
 
#header
{
width:1000px;
background:black;
clear:both;
}
 
#wrapper
{
width:1000px;
background:blue;
clear:both;
}
.block
{
width:100px;
height:auto;
background:black;
margin:10px;
 
}
 
#footer
{
width:1000px;
background:red;
clear:both;
}
__________________
Помощь в написании контрольных, курсовых и дипломных работ здесь
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
23.01.2013, 19:14
Ответы с готовыми решениями:

почему сбрасывается background родителя, когда в нем 3 элемента с float:left?
http://jsfiddle.net/7MTZf/ вот собственно, с двумя флоатами работает, с третьим бэкграунд...

Исчезает фон меню, когда к селектору идентификаторов menu ul li применяю значение float: left;
Добрый день, уважаемые участники форума. Я в вёрстке пока ещё новичок, и очень прошу ваш совет. А...

Когда делаю Float left пропадает фон у родительского элемента, точнее он есть но браузеру на него все равно
Вобщем верстал футер он у меня должен быть вот таким пока он у меня вот такой но как только...

Ошибка при создании трех колонок (float:left, float:right и margin:0 auto;)
3-й час бьюсь, но никак не могу понять, что не так делаю. почему оранжевый блок опускается? ...

5
13201 / 6588 / 1040
Регистрация: 10.01.2008
Сообщений: 15,069
23.01.2013, 19:33 2
Потому что внутри родителя получаются все float'ы, не остаётся в нем нормального потока (normal flow), поэтому родитель схлапывается по содержимому до нулевой высоты.

Добавьте внутрь родителя после всех float'ов блок с clear:both - тогда родитель должен будет уместить все до него включительно.
1
0 / 0 / 1
Регистрация: 23.01.2013
Сообщений: 11
23.01.2013, 19:57  [ТС] 3
Как я понял, после блоков с float, всегда должен быть блок с clear:both; , правильно?
0
4 / 4 / 3
Регистрация: 19.06.2012
Сообщений: 99
23.01.2013, 23:30 4
не всегда) можно юзать overflow и другие вещи... почитайте про флоуты.
0
13201 / 6588 / 1040
Регистрация: 10.01.2008
Сообщений: 15,069
24.01.2013, 15:48 5
Цитата Сообщение от rodgerfox Посмотреть сообщение
не всегда) можно юзать overflow и другие вещи
Злоупотребление overflow тормозит рендеринг страницы, поэтому его только в особых случаях.

Другие вещи - это какие, например?
2
4 / 4 / 3
Регистрация: 19.06.2012
Сообщений: 99
31.01.2013, 13:41 6
Цитата Сообщение от Vovan-VE Посмотреть сообщение
Злоупотребление overflow тормозит рендеринг страницы, поэтому его только в особых случаях.

Другие вещи - это какие, например?
Про overflow спасибо, я честно не задумывался про это (как то странно и пугающе, что игнорировал раньше это, хотя раньше и не так часто юзал такой хак).
Про что то определенное не могу точно сказать, все от задачи зависит. Может просто не использовать флоат. или смотреть для какого элемента задаем и нужно ли после очищать обтекание.
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
31.01.2013, 13:41

как задаю значение float внутри главного контейнера то он теряет высоту
В общем чтот я не пойму есть контейнер wrapper в нём ещё 2 &quot;leftmenu&quot; и &quot;center&quot;, задаю &quot;leftmenu&quot;...

Почему, когда задаю padding и margin отступ происходит у соседнего элемента, а не у того, которому задаю?
p.author{ font-size: 20px; font-weight: bold; float: left; border-bottom: 2px...

float:left
у меня есть блок не фиксированной высоты с определенным фоном , внутри блоки с float:left (в них...

float: left
У меня выводится 4 изображения в горизонтальном порядке и до бесконечности в вертикальном. CSS: ...

Не работает float:left
Здравствуйте почему-то не работает float:right { border:0px solid #000; position:absolute; ...

про float элементы и их родителя
я уверен что этот вопрос очень прост, однако, почему при такой структуре у main не задается фон...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.