CSS 위치 지정 - div가 다음 줄로 이동하지 않습니다.

div #leftcol이 탐색 패널 아래로 이동하지 않습니다. Dreamweaver에서는 #leftcol 및 #navigation이 같은 div 인 것처럼 표시합니다. 나는 절대적인 초보자이므로 어떤 도움도 크게 받으실 수 있습니다. 또한CSS 위치 지정 - div가 다음 줄로 이동하지 않습니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<style type="text/css"> 

#container { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 1.2em; 
    width: 800px; 
    margin: 0 auto; 
    border: 1px solid #FC3; 
} 

#header h1 { 
    float: right; 
    padding-right: 150px; 
    padding-top: 50px; 
} 

#navigation { 
    border-left: 1px solid #FC3; 
    border-right: 1px solid #FC3; 
    border-bottom: 1px solid #FC3; 
} 

#navigation ul { 
    margin: 0; 
} 

#navigation ul li { 
    display:inline; 
} 

#navigation ul li a { 
    display: block; 
    padding: 5px; 
text-decoration: none; 
    float: left; 
} 

#navigation ul li a:hover { 
    background-color: #cadb2b; 
} 

#navigation ul li a:visited { 
    background-color: #cadb2b; 
} 

#leftcol { 
    width: 200px; 
    background: #cadb2b; 
    border: 1px solid black; 
    clear: both; 
} 

</style> 
</head> 

<body> 
<div id="container"> 
    <div id="header"> 
    <img src="header" /> 
    <h1>Some Title!</h1> 
    </div> 
    <div id="navigation"> 
    <ul> 
    <li><a href="nova.html">Home</a></li> 
    <li><a href="#">About</a></li> 
    <li>Gallery</li> 
    <li>Contacts</li> 
    </ul> 
    </div> 
    <div id="leftcol">Content for id "leftcol" Goes Here</div> 
</div> 
</body> 
</html>

, 나는 다음 그림에 <h1> 위치 그래서 오른쪽으로 떠올랐다하고 패딩을 배치하는 방법을 알고하지 않았다 : 여기에 코드입니다. 머리말 옆에 제목을 배치하는 올바른 방법입니까? 미리 감사드립니다. 추신. 새로운 사용자 인 경우 내 탐색 및 헤더 그림에서 링크 2 개를 제거해야했기 때문에 이상하게 보일 수도 있습니다.

출처

2011-11-03 Kristiyan Nikolov

원하는 것이 무엇인지 알 수 없습니다. 페인트로 모의 작업을하고 이미지를 게시 할 수 있습니까? – xbonez