Using jQuery Tabs script with an icon to remove the
tab but this code renders differntly in IE8 and Firefox 3.6.2. The problem is that Firefox wraps the
tab and puts "X" signs in new row, whicle IE correctly renders it in the same row (but not centered vertically as it should but rather in the top right corner - which is still better than Firefox behaviour).
I have spent the last hour trying to find out if the problems lies in CSS (both with Firebug and IE's Developer Toolbar) but there is nothing special in CSS, just the default jQuery Flick UI CSS.
<div id="tabgroup.<%= Model.Slug %>">
<ul>
<%
foreach (ContentListItem
tab in Model.Contains)
{%>
<li><a href="#tab\.<%=tab.Slug%>">
<%=tab.Title%></a><% if (Context.User.IsInRole("Administrators"))
{ %><span class="ui-icon ui-icon-close"><%=Resources.Localize.Routes_TabDelete %></span><% } %>
</li>
<%
}%>
</ul>
<%
foreach (ContentListItem
tab in Model.Contains)
{
Html.RenderAction("Display", "
Tab", new { slug =
tab.Slug });
}%>
</div>
Please disregard the stuff about ASP.NET MVC code...
