Đặt hai div một bên dưới một số khác

Question

Tôi đang gặp một số vấn đề với việc đặt hai div một cái khác nhau.

Tôi đã thử một số giải pháp được tìm thấy trong Stackoverflow như dưới đây.
Nhưng dường như không có gì hoạt động.

HTML:

<div id="wrapper"> 
<div id="up"></div> 
<div id="down"></div> 
</div> 

CSS:

#wrapper{position: absolute;} 
#up{position: absolute; float:left;} 
#down{position: absolute; float:left; clear:left;} 

Dưới đây là cố gắng của tôi,

Fiddle

Giúp sẽ được đánh giá.

Answer 1

Xóa CSS. Thẻ DIV là các phần tử khối và sẽ tự động chảy xuống trang. Bạn đang thả nổi chúng sẽ khiến chúng được hiển thị cạnh nhau.

Đặc biệt loại bỏ thuộc tính "nổi".

Answer 2

Đó là cách hoạt động của DIV theo mặc định, chỉ cần xóa css của bạn. Xem một ví dụ làm việc ở đây: jsfiddle

<div id="wrapper"> 
<div id="up"></div> 
<div id="down"></div> 
</div>​ 

Answer 3

Tôi không chắc chắn nếu bạn muốn div bên ngoài để được lớn hơn chiều cao của trang, nhưng đó là những gì điều này:

#DivSlider 
{ 
    width:100%; 
    position:absolute; 
    height:170%; 
    background-color:green; 
} 

#DivHome 
{ 
    height:26%; 
    background-color:orange; 
    border:1px solid black; /* You were missing the 'px' here */ 
} 

#DivSkills 
{ 
    height:25%; 
    background-color:white; 
    border:1px solid black; 
}​