2013-05-14 73 views
0

我把下面的菜單控制我的網頁上之間呈現不同:菜單控制建立和環境

<div class="Phase2MenuContainer"> 
    <asp:Menu runat="server" ID="mnuHome" Orientation="Vertical" 
     StaticMenuStyle-CssClass="Phase2Menu"> 
     <Items> 
      <asp:MenuItem Selectable="true" Text="Download Sketch Sheet" NavigateUrl="~/Documents/Sketch Sheet.pdf" Target="_blank"></asp:MenuItem> 
      <asp:MenuItem Selectable="true" Text="Create Data Sheet" NavigateUrl="CreateDataSheet.aspx"></asp:MenuItem> 
      <asp:MenuItem Selectable="true" Text="Personalize Data" NavigateUrl="Personalize.aspx" Enabled="false"></asp:MenuItem> 
     </Items> 
    </asp:Menu> 
</div> 

當我在我的本地運行它,它建立了桌子這是很好的,因爲我知道這個時候我寫的我的CSS。

這裏的問題是,當我將它複製到實時環境中時,它使用跨度和div來構建,所以我所有的CSS都打破了。

這裏的CSS(實況副本只是刪除了margin: 5px 0;線)

.Phase2MenuContainer 
{ 
    width: 250px; 
    margin: 15px auto; 
} 
.Phase2Menu a, .Phase2Menu span a 
{ 
    display: block; 
    padding: 10px; 
    margin: 5px 0; 
    color: #fff; 
    height: 30px; 
    line-height: 30px; 
    width: 200px; 
    background: #018CD2; 
    border: 1px solid #0159a0; 
} 
.Phase2Menu a[disabled=true], .Phase2Menu span[disabled=disabled] 
{ 
    display: block; 
    padding: 10px; 
    margin: 5px 0; 
    color: #fff; 
    height: 30px; 
    line-height: 30px; 
    width: 200px;  
    background: #c1c1c1; 
    border: 1px solid #0159a0; 
} 
.Phase2Menu a:not([disabled=true]):hover 
{ 
    background: #3B3486; 
} 

我花了大約一個半小時來修復它,但我得到了它現在的工作(雖然現場樣式表是不同的我測試一)。

任何人都可以向我解釋爲什麼我的本地主機和現場服務器之間建立不同的菜單?我敢肯定這不應該發生,如果它已經正確完成...

回答

2

設置RenderingModeMenuTable ..就像這樣。因此,它總是會呈現你Menu如表...

<asp:Menu runat="server" ID="mnuHome" Orientation="Vertical" RenderingMode="Table" 
     StaticMenuStyle-CssClass="Phase2Menu"> 
+0

真棒提示:)不知何故,我覺得有一個屬性,會做到這一點。只是不知道它是什麼 – Ortund 2013-05-14 10:28:11

+0

@Outund它在你的瀏覽器中的菜單項的渲染模式中定義.....如果你設置爲表格而不是你的菜單將在瀏覽器上呈現爲表格總是.... – 2013-05-14 10:29:24

0

我也面臨同樣的解決方案前兩天,不幸的是,RenderingMode並沒有在我的項目工作,因爲ASP.NET支持的版本。因此,作爲替代解決方案,我將菜單放在div控件中,並將樣式表設置如下。

.div br { 
    display: none; 
} 

希望這可能會有幫助。