Adjusting Appearance of the RadTabs

[Robert]

Please take a look at the screenshot I've provided.  Do you notice that there's not enough white space below the tab titles "Regular", "Cable Bolts", and "Reconditioning"?

I tried several approaches to fix this but could not figure it out.  How can I fix this?  Note: I do NOT want to use skins.

Robert

[Robert]

Just following up on this.  There's no way to move the text on the tabs up or down?

[Kate]

Hi Robert,

One way to get the desired appearance is to get the correct css class selector and increase the margin/padding of the text. Can you clarify if you use any custom styles as well, since the text of the tabs in our demos do not look the same as the one demonstrated in your attached image?

Kind regards,
Kate
the Telerik team

[Robert]

Kate,

Here's my pertinent layout code:

        <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1" SelectedIndex="0" Align="Justify" ReorderTabsOnSelect="false"<br>                                               Width="100%" Height="407px" AutoPostBack="true" OnTabClick="RadTabStrip1_Click"><br>          <Tabs><br>            <telerik:RadTab Text="Regular" Width="100" /><br>            <telerik:RadTab Text="Cable Bolts" Width="100" /><br>            <telerik:RadTab Text="Reconditioning" Width="100" /><br>          </Tabs><br>        </telerik:RadTabStrip>

As you see, there are no custom styles introduced there.  Though there are several parent DIVs which may have an effect.

In any case, what is the particular CSS Selector with which I should experiment with to adjust the vertical position of the Tab text?

Robert

[Robert]

Experimenting a little, I can indeed move the tab text up like by introducing this style into my style sheet:

.rtsIn
{
  margin-top:-2px;
}


Unfortunately, that wrecks the curved styling of the tabs themselves.  What I need to manipulate is just the text itself.

[Robert]

This seems to be the solution:

.rtsTxt
{
  margin-top:-2px;
}