проблема с float + div

zerofx · October 10, 2012

Привет всем ... У меня не то что проблема, мне нужна консультация ... Вот что я хотел спросить ... Я меня есть несколько блоков, основной <div id = "main">, и еще 3 дочерние <div id = "d1">, <div id = "d2">, <div id = "d3"> - хочу чтобы они строились по левому краю - есть - float: left; - все бы хорошо только прописывать флоат очень много надо ... Можно ли как-то задать осномвному блокe <div id = "main"> правило чтобы все дочерние блоки строились слева ...

т.е. мне нужно показать как можно используя одно правило для <div id ="main"> - заставить все внутренние блоки строиться слева как в float: left;


<html>

<head>
  <title>Float+DiV</title>
</head>
<body>

<div id="main">

<div id="d1">Div 1</div>
<div id="d2">Div 2</div>
<div id="d3">Div 3</div>

</div>

</body>
</html>

wwt · October 10, 2012

CSS


.fleft {
   float:left;
}

HTML


<div id="main">

<div id="d1" class="fleft">Div 1</div>
<div id="d2" class="fleft">Div 2</div>
<div id="d3" class="fleft">Div 3</div>

</div>

или

CSS


#main > div {
   float:left;
}

HTML


<div id="main">

<div id="d1">Div 1</div>
<div id="d2">Div 2</div>
<div id="d3">Div 3</div>

</div>

Edited October 10, 2012 by wwt

Catherine · October 10, 2012

CSS


#main > div {
   float:left;
}

Возможно, даже как-то так:


#main > div[id^=d] {
    float: left;
}?

Но первый вариант (с классами у дочерних элементов) мне нравится гораздо больше, он надежнее.

wwt · October 10, 2012

...
Но первый вариант (с классами у дочерних элементов) мне нравится гораздо больше, он надежнее.

+1 поэтому он и первый )))

zerofx · October 10, 2012

...
Но первый вариант (с классами у дочерних элементов) мне нравится гораздо больше, он надежнее.
+1 поэтому он и первый )))

не работает ... как блоки стояли так и стоят друг под другом ... а мне нужно чтобы они одним правилом обтекали друг друга слева ... я могу то сделать через float... но сами подумайте сколько раз придется прописывать его в блоках ... а ленивый и хотел бы прописать его только в одном основном блоке <div id="main"> (бывают и такие ситуации, когда то потрбино тики для одного основного блока)

wwt · October 10, 2012

...
Но первый вариант (с классами у дочерних элементов) мне нравится гораздо больше, он надежнее.
+1 поэтому он и первый )))
не работает ... как блоки стояли так и стоят друг под другом ... а мне нужно чтобы они одним правилом обтекали друг друга слева ... я могу то сделать через float... но сами подумайте сколько раз придется прописывать его в блоках ... а ленивый и хотел бы прописать его только в одном основном блоке <div id="main"> (бывают и такие ситуации, когда то потрбино тики для одного основного блока)

раз не работает значит вы привели не полный код, и у вас там где-то есть более приоритетное правило.Либо вы что-то делаете не так.

Edited October 10, 2012 by wwt

zerofx · October 10, 2012

...
Но первый вариант (с классами у дочерних элементов) мне нравится гораздо больше, он надежнее.
+1 поэтому он и первый )))
не работает ... как блоки стояли так и стоят друг под другом ... а мне нужно чтобы они одним правилом обтекали друг друга слева ... я могу то сделать через float... но сами подумайте сколько раз придется прописывать его в блоках ... а ленивый и хотел бы прописать его только в одном основном блоке <div id="main"> (бывают и такие ситуации, когда то потрбино тики для одного основного блока)
раз не работает значит вы привели не полный код, и у вас там где-то есть более приоритетное правило.Либо вы что-то делаете не так.

ок... кажись Apach тупил... но - с Moz Ope Chr - всьо ОК! но ІЕ .... нехочет...

Catherine · October 10, 2012

ок... кажись Apach тупил... но - с Moz Ope Chr - всьо ОК! но ІЕ .... нехочет...

Чего не хочет IE? Какой Apache? Первый вариант работает, второй вариант тоже работает.

Покажите свой вариант.

Sign In

проблема с float + div

Question

zerofx

Link to comment

Share on other sites

7 answers to this question

Recommended Posts

wwt

Link to comment

Share on other sites

Catherine

Link to comment

Share on other sites

wwt

Link to comment

Share on other sites

zerofx

Link to comment

Share on other sites

wwt

Link to comment

Share on other sites

zerofx

Link to comment

Share on other sites

Catherine

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information