[Solved] Tab positioning

[Justis]

Hello,
 I am trying to have tabs align to the left side and right side of the tabstrip simultaneously. I know it is possible do left alignment (default behavior) or right alignment (using .HtmlAttributes( new { @class = "t-rtl" } ); ) exclusively, so it makes me curious if tabs can be positioned by CSS. Below is my tabstrip as it is currently in my project-

<% Html.Telerik().TabStrip()
.Name("MenuStrip")
.SelectedIndex(0)
.Items(items =>
{
items.Add().Text("Primary").Content(() =>
{
Html.RenderPartial("Primary");
});
items.Add().Text("Holds").Content(() =>
{
Html.RenderPartial("HoldingView");
});
items.Add().Text("Search").Content(() =>
{
Html.RenderPartial("Search");
});
items.Add().Text("Maintenance").Content(() =>
{
Html.RenderPartial("Maintenance");
});
})
.Render();
%>

If I'm thinking this through correctly, we should be able to use .HtmlAttributes to declare right alignment in Tabstrip.Items(), but this doesn't seem to be the case in this example-

items.Add().Text("Maintenance").Content(() =>
{
    Html.RenderPartial("Maintenance");
}).HtmlAttributes(new{ @class = "t-rtl"});

To elaborate on what I'm looking to do, I have attached a picture of the desired behavior. The data visible in the grid is fictional and unrelated to my current project. Is this currently possible with Telerik v.2011.3.1115.340 (Q3 release) ? Any advice would be greatly appreciated.

Regards,
J

[Dimo]

Hi Joshua,

The t-rtl CSS class is not a universal means to change layout and alignment in every possible case. Indeed, the CSS class defines the styles that you need, however, the CSS code is designed to support cases in which the class is applied to some parent element, not TabStrip items.

Achieving the desired result is pretty easy with a custom CSS class:

tabstrip.Add()
        .Text("Tab Text")
        .HtmlAttributes(new { @class = "rightTab" })

div.t-tabstrip .rightTab
{
    float: right;
    margin-right: 0;
    margin-left: .3em;
}

Greetings,
Dimo
the Telerik team

[Justis]

Hi Dimo,
 Your solution works perfectly. I appreciate the swift response and adequate explanation of the t-rtl class!

Regards,
J