CSS ids, 클래스 및 레이아웃

Question

[현재 : http://www.jsfiddle.net/tqtFg Michael Durrant]
저는 CSS에 익숙하며 로고와 탐색 패널이 나란히있는 웹 사이트를 만들려고합니다. 처음에 사이트를 방문하면 패널은 '최고 내용'에서 벗어나 실제로 오른쪽 아래에 표시되지만 로고를 클릭하면 동일한 페이지로 이동하여 패널이 나타납니다.

내 사이트 : http://acews.x10.mx

처음 열 때 뭔가 intialized되지 않는 것 같다,하지만 무엇을 말할 수 없다. 여기에 내 HTML 코드가있다. 여기

<div id="topcontent"> 
    <div id="top"> 
     <a href="index.html"> 
      <img src="logo.png"> 
     </a> 
     <div id="navbar"> 
      <ul id="menubar"> 
       <li class="menuButton"><a href="index.html" class="home">Home</a></li> 
       <li class="menuButton"><a href="about.html" >About ACE</a></li> 
       <li class="menuButton"><a href="login.html" >Customer Login</a></li> 
      </ul> 
     </div> 
    </div> 

내 CSS 코드입니다; 로고 링크에 대한

body { 

} 

/*Content page divider*/ 
#topcontent { 
    /* margin: 50px auto; */ 
    height: 170px; 
    margin-left:auto; 
    margin-right:auto; 
    background-image:url('backgroundcolor.png'); 
} 

#top { 
    height: 170px; 
    width: 900px; 
    margin-left:auto; 
    margin-right:auto; 
} 

/* MenuBar */ 
#navbar { 
margin-top:60px; 
float:right; 
} 

ul#menubar { 
/* margin:20px; */ 
list-style:none; 
margin-left:auto; 
margin-right:auto; 
padding: 5px 10px 0 10px; 

} 

ul#menubar li { 
display:inline; 
font-family: calibri; 
font-weight: bold; 
margin-left:10px; 
} 

ul#menubar li a { 
text-decoration:none; 
text-align:center; 
padding:5px 10px; 
/* width:100px; */ 
color:#FFFFFF; 
float:left; 
font-size:26px; 
} 

.menuButton a:hover{ 
background-color:#618E00; 
text-decoration: none; 
    -webkit-border-radius: 5px; 
} 

Answer 1

추가 ID : 그것은 확인을해야하는 플로트를 추가하는 경우

<a href="index.html" id="logo"> 
     <img src="logo.png"> 
    </a> 

와 CSS 로고

#logo {float:left;} 

링크는, 하나 개의 라인과 같다.