Hi All,
I'm using the following code from the demo in a new Telerik created Solutions...
@(
Html.Telerik().PanelBar()
.Name("PanelBar")
.HtmlAttributes(new { style = "width: 250px; float: left; margin-bottom: 30px;" })
.ExpandMode(PanelBarExpandMode.Multiple)
.SelectedIndex(0)
.Items(items =>
{
items.Add()
.Text("V2AMX-BY5604J")
.ImageUrl("~/Content/images/icon_servicemaster.png")
.ImageHtmlAttributes(new { alt = "Master Server Icon" })
.Content("TreeView HERE");
items.Add()
.Text("Mail")
.ImageUrl("~/Content/images/icon_servicevod.png")
.ImageHtmlAttributes(new { alt = "Mail Icon" })
.Items(subItem =>
{
subItem.Add()
.Text("Personal Folders")
.ImageUrl("~/Content/images/icon_config.png")
.ImageHtmlAttributes(new { alt = "Personal Folders Icon" });
subItem.Add()
.Text("Deleted Items")
.ImageUrl("~/Content/images/icon_config.png")
.ImageHtmlAttributes(new { alt = "Deleted Items Icon" });
subItem.Add()
.Text("Inbox")
.ImageUrl("~/Content/images/icon_config.png")
.ImageHtmlAttributes(new { alt = "Inbox Icon" }).Enabled(false);
subItem.Add()
.Text("My Mail")
.ImageUrl("~/Content/images/icon_config.png")
.ImageHtmlAttributes(new { alt = "My Mail Icon" });
subItem.Add()
.Text("Sent Items")
.ImageUrl("~/Content/images/icon_config.png")
.ImageHtmlAttributes(new { alt = "Sent Items Icon" });
subItem.Add()
.Text("Outbox")
.ImageUrl("~/Content/images/icon_config.png")
.ImageHtmlAttributes(new { alt = "Outbox Icon" });
subItem.Add()
.Text("Search Folders")
.ImageUrl("~/Content/images/icon_config.png")
.ImageHtmlAttributes(new { alt = "Search Folders Icon" });
});
})
)
In IE the above renders correctly, but in Firefox All the subitems under the "Mail" item are rendered as if they at staggered like so
...
instead of directly under each other. What am I missing because this code is copy and pasted directly from the Telerik demos, where it renders correctly on all browsers.