2012-06-06 30 views
-4

這裏是HTML/Razor視圖:爲什麼div菜單呈現在標題之外?

</head> 
    <body> 
     <header> 
      <div class="divHeader"> 
       Title Here 
      </div> 
      <div class="divMenu"> 
       <nav> 
        <ul id="menu"> 
         <li>@Html.ActionLink("Home", "Index", "Home")</li> 
         <li>@Html.ActionLink("About", "About", "Home")</li> 
         <li>@Html.ActionLink("Contact", "Contact", "Home")</li> 
        </ul> 
       </nav> 
      </div> 
     </header> 
     <div class="divBody"> 
      @RenderBody() 
     </div> 
     <footer> 
      <div class="divFooter"> 
       All Rights Reserved. 
      </div> 
     </footer> 
    </body> 
    </html> 

這裏是CSS:

body 
{ 
    margin: 0 auto; 
    max-width: 960px; 
    padding: 0px; 
    background-color: White; 
    text-align: center; 
} 
header 
{ 
    height: 60px; 
    background-color: #C0C0C0; 
} 
footer 
{ 
    height: 20px; 
    background-color: #C0C0C0; 
} 
div.divHeader 
{ 
    color: #006600; 
    font-style: normal; 
    font-family: Shruti; 
    font-size: 3em; 
    font-weight: bold; 
} 
div.divBody 
{ 
    color: #000000; 
    font-style: normal; 
    font-family: Georgia; 
    font-size: small; 
    font-weight: normal; 
    text-align: left; 
} 
div.divFooter 
{ 
    color: #006600; 
    font-style: italic; 
    font-family: Shruti; 
    font-size: 0.75em; 
    font-weight: bold; 
} 
header div.divMenu 
{ 
    position: relative; 
} 

/* menu 
----------------------------------------------------------*/ 
ul#menu { 
    font-size: 1.3em; 
    font-weight: 600; 
    margin: 0; 
    text-align: left; 
} 

    ul#menu li { 
     display: inline; 
     list-style: none; 
     padding-right: 15px; 
    } 

     ul#menu li a { 
      background: none; 
      color: #999; 
      text-decoration: none; 
     } 

     ul#menu li a:hover { 
      color: #333; 
      text-decoration: none; 
     } 
+0

-1。許多不相關的東西,HTML不是HTML,而是剃刀視圖,與C#無關...... –

+0

各種不相關的東西使網站! – WinFXGuy

+0

我想我誤解了你試圖問的東西,雖然它與佈局有關(在這種情況下,背景顏色等問題不在問題中),但它可能是其他的東西。點了,還是覺得這樣還不是很清楚和簡潔-1。 –

回答

0

這是唯一的視覺,渲染是正確的,但你的CSS樣式給人一種高度小於該divheader它除了包含菜單。

相關問題