22.03.2010, 18:34
|
 |
:-/
|
|
Регистрация: 28.09.2009
Сообщений: 1,126
|
|
|
display:inline
есть несколько элементов div, вложенных во внешний div, который находится в потоке
Пока эти div блочные - они все укладываются один под другим во внешнем div.
<head>
<style>
.cl {width:50px; height:50px; background-color:red;}
body { margin:0; padding: 0px}
</style>
</head>
<body>
<div id="outerDiv" style="width:300px; height:90px;">
<div class="cl"></div>
<div class="cl"></div>
<div class="cl"></div>
</div>
</body>
Почему, если я ставлю им display:inline, они исчезают ?
В IE - они не исчезают, это баг Firefox?
<head>
<style>
.cl {width:50px; height:50px; background-color:red; display:inline}
body { margin:0; padding: 0px}
</style>
</head>
<body>
<div id="outerDiv" style="width:300px; height:90px;">
<div class="cl"></div>
<div class="cl"></div>
<div class="cl"></div>
</div>
</body>
|
|
22.03.2010, 18:44
|
|
Новичок на форуме
|
|
Регистрация: 19.02.2008
Сообщений: 9,177
|
|
|
Они не исчезают, а схлопываются, т.к. в них нет контента. А ширины и высоты у инлайновых элементов нет.
|
|
22.03.2010, 19:01
|
|
:-/
|
|
Регистрация: 28.09.2009
Сообщений: 1,126
|
|
|
Ага,
"Важным свойством строчных боксов является то, что у них есть свой собственный размер. Он складывается из размера шрифта (для букв), собственных размеров картинок, расстояния между строками. Это означает, что браузер при раскладке строчных боксов определяет их размер сам, без указания всяких width и height"
=>
фон увидим, если набьем строчные боксы строчным же содержимым (буковками))
Тогда это баг IE, что он отображает несхлопнувшиеся строчные div , если им задать размер.
|
|
22.03.2010, 19:53
|
 |
Пионэр
|
|
Регистрация: 16.11.2009
Сообщений: 1,322
|
|
|
Shaci,
Вы это с W3C взяли? Речь идет про анонимные текстовые блоки, а если инлайновый элемент пуст, или содержит только пробельные символы, в нем не содержится ни одного такового.
|
|
22.03.2010, 20:17
|
|
:-/
|
|
Регистрация: 28.09.2009
Сообщений: 1,126
|
|
Сообщение от subzey
|
Shaci,
Вы это с W3C взяли?
|
http://softwaremaniacs.org/blog/2005...s-layout-flow/
|
Цитата:
|
|
Речь идет про анонимные текстовые блоки
|
Так там вроде и про текстовые и про картинки, то есть про все строчные боксы, и про то , что браузер определит их размер сам.
|
Сообщение от subzey
|
|
, а если инлайновый элемент пуст, или содержит только пробельные символы, в нем не содержится ни одного такового.
|
|
Сообщение от Shaci
|
|
фон увидим, если набьем строчные боксы строчным же содержимым (буковками))
|
Ну да, если инлайновый элемент пуст, то он схлопывается, а если содержит текстовый блок, то будет определен его размер и будет видно его фон.
<head>
<style>
.cl {width:50px; height:50px; background-color:red; display:inline}
body { margin:0; padding: 0px}
</style>
</head>
<body>
<div id="outerDiv" style="width:300px; height:90px;">
<div class="cl">param</div>
<div class="cl">pam</div>
<div class="cl">pam</div>
</div>
</body>
Просто в IE он у меня показывает пустые inline блоки того размера, который я им указал через width и height, т.е. они не схлопываются
Вроде так.
|
|
22.03.2010, 20:18
|
|
Пионэр
|
|
Регистрация: 16.11.2009
Сообщений: 1,322
|
|
|
Shaci,
извините, кажется, мы говорим об одном и том же, и я просто Вас не понял.
|
|
22.03.2010, 20:20
|
|
:-/
|
|
Регистрация: 28.09.2009
Сообщений: 1,126
|
|
|
Цитата:
|
|
кажется, мы говорим об одном и том же
|
Да, похоже на то 
Там даже видно, что пробельные символы не входят, на них фона нет. |
|
23.03.2010, 17:06
|
 |
Профессор
|
|
Регистрация: 03.04.2009
Сообщений: 1,263
|
|
|
Сообщение от Shaci
|
|
Там даже видно, что пробельные символы не входят, на них фона нет.
|
Они не входят в div'ы, потому и фона нет:
<head>
<style>
.cl {width:50px; height:50px; background-color:red; display:inline}
body { margin:0; padding: 0px}
</style>
</head>
<body>
<div id="outerDiv" style="width:300px; height:90px;">
<div class="cl"> param </div>
<div class="cl"> pam </div>
<div class="cl"> pam </div>
</div>
</body>
|
|
23.03.2010, 17:30
|
|
:-/
|
|
Регистрация: 28.09.2009
Сообщений: 1,126
|
|
|
Сообщение от e1f
|
|
Они не входят в div'ы, потому и фона нет:
|
Да, это я спутал. |
|
|
|
