오른쪽 박스를 오른쪽으로 뜨는 법 ...?

Question

뷰포트에서이 중심 래퍼가 유동적으로 작동하도록하려고하지만 오른쪽 div를 배치하는 데 문제가 있습니다.

<div id="wrapper"> 
<div id="left">Left</div> 
<div id="middle">Middle</div> 
<div id="right">Right</div> 
</div> 

그리고 여기 (flawed-) CSS입니다 : 다음은 HTML이 모습입니다

#wrapper{ 
top: 0px; 
width:80%; 
margin: 0 auto;} 

#left { 
top: 0px; 
margin: 0px; 
padding: 10px; 
background: #555; 
width:10%; 
height:400px; 
float:left;} 

#middle { 
padding: 10px; 
background: #666; 
height:400px; 
width:75%; 
clear:none;} 

#right { 
top: 0px; 
margin: 0px; 
padding: 10px; 
background: #777; 
width:10%; 
height:400px; 
float:right;} 

무엇 일어나는 것은 그 중간 DIV 아래 대신에 오른쪽 DIV 장소 자체 권리. 이 논리를 찾을 수없는 것 같아요 ... ... 위치와 함께 tryed했습니다 : 상대적, 번호가 매겨진 너비, 가운데 등등 오른쪽 div ...하지만 아무것도 그 자리에 도약하지 않습니다. 무엇을해야합니까? Thx/Nic

Answer 1

html 요소의 순서를 바꿀 수 있습니다. 왼쪽 div 앞에 오른쪽 div가 있습니다.

position : absolute를 사용하여 3 열 레이아웃을 만드는 다른 여러 가지 방법이 있습니다. Google은 "3 열 레이아웃"을 사용하여 좋은 예를 찾아야합니다.

Answer 2

왼쪽에 #middle div를 배치하고 #left에 약간의 여백을 적용해야합니다. 이것은 문제를 해결해야합니다 :).