1

横に表示するのではなく、id2 の下に表示する id3 が必要ですか?

CSSを使用してそれを達成するにはどうすればよいですか?

html

<div class="main" ></div>
<div id="id1">Im in div1</div>
<div id="id2">Im in div2</div>
<div id="id3">Im in div3</div>
<div></div>

CSS

#id1{
    background-color:green;
    width:30%;  
    height:200px;
    border:100px;   
    float:left;
}

#id2{
    background-color:red;
    width:20%;  
    height:100px;
    border:100px;   
    float:left;
}

#id3{
    background-color:yellow;
    width:10%;  
    height:300px;
    border:100px;   
    float:left;
}

http://jsfiddle.net/w9xPP/

4

3 に答える 3

0

好きclear: left;に設定#id3

#id3{
clear: left;
background-color:red;
width:20%;  
height:100px;
border:100px;   
float:left;
}

float を使用すると、後続の要素が下ではなく横に表示されるように指示されます。を使用clearすると、フロートがクリアされ、その動作が取り除かれます。

http://jsfiddle.net/w9xPP/1/

于 2013-08-12T18:36:50.087 に答える