CSS IDS，類和佈局

[當前在：http://www.jsfiddle.net/tqtFg邁克爾杜蘭特]
我很新的CSS，我試圖創建一個網站與徽標和導航面板並排。如果您最初訪問該網站，該面板會出現在「topcontent」之外，實際上位於右下方，但如果您單擊了該徽標以轉至同一頁面，則會出現面板，我希望它在哪裏！CSS IDS，類和佈局

我的網站：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; 
}

來源

2011-11-10 r0bb077

嗨，羅伯特，我爲您創建了一個jsfiddle： –

http://jsfiddle.net/tqtFg/ –

您需要更新網址和引用，例如背景圖像，但這應該可以幫助你和其他人診斷和治療你的問題;） –

增加號碼的鏈接與標誌：

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

和CSS

#logo {float:left;}

鏈接與標誌就像是一個單行，如果添加浮到它應該沒問題。

來源

2011-11-10 14:04:20 Kokers

乾杯科克斯，當你知道如何呃！ – r0bb077

CSS IDS，類和佈局

回答

相關問題