Telerik MVC菜單控制 - 自動寬度

Question

我想使用Telerik MVC Menu控件（作爲按鈕欄），但似乎無法將寬度設置爲自動生成。我的意思是，菜單一直持續到DIV的末尾。我希望菜單的寬度與按鈕寬度的總和一樣寬。實際上，Telerik演示與我的菜單做的是一樣的：

http://demos.telerik.com/aspnet-mvc/razor/menu/sitemapbinding （看看菜單如何繼續到「其他產品線」的右側）。

這裏是我的菜單：

@{ Html.Telerik().Menu() 
      .Name("case-history-button-menu") 
      .ClientEvents(events => events.OnSelect("onCaseHistoryMenuBarSelect")) 
      .Items(menu => 
      { 
       menu.Add() 
        .Text("Add a Response").HtmlAttributes(new { id = "cases-history-addresponse" }); @*Sets the ID HTML attribute so we can access it *@ 
       menu.Add() 
        .Text("Add a Comment").HtmlAttributes(new { id = "cases-history-button-addcomment" }); ; 
       menu.Add() 
        .Text("Back to Cases").HtmlAttributes(new { id = "cases-history-button-back" }); ; 
      }) 
      .Render(); 
    } 

我不知道我可以只硬編碼我的寬度......但我添加或刪除按鈕（編程）我希望菜單調整。

Answer 1

Telerik MVC菜單呈現爲<UL>元素。後者默認顯示塊顯示，這意味着它佔用了所有可用空間。

@{ Html.Telerik().Menu() 
      .Name("case-history-button-menu") 
      // set the display to inline-block 
      .HtmlAttributes(new { style = "display: inline-block" }) 
    } 

有想法雖然這舊版本的IE將不接受inline-block的顯示：當你需要它，你可以重寫顯示爲「inline-block的」，然後選擇菜單的尺寸應該。如果您必須支持較老的IE，您可能需要「內聯」。