Apr 20, 2009

How to apply CssClass for Ajax TabContainer

A tab is constructed of nested tags. The class ajax__tab_outer defines the right side of the tab, the class ajax__tab_inner defines the left side of the tab, and finally ajax__tab_tab defines the middle of the tab.Some usefull link are CssClass1,CssClass2


/* Style Sheet Attributes */

.visoft__tab_xpie7 .ajax__tab_header

{

font-family: verdana,tahoma,helvetica;

font-size: 18px;

color: #FF9966;

background-color: #ffffff;

}

.visoft__tab_xpie7 .ajax__tab_outer

{

background-color: #ffffff;

border: 1px;

border-style:none solid none none;

border-color:#999999;

}

.visoft__tab_xpie7 .ajax__tab_inner

{

background-color: #E9EFF7;

border: 1px;

border-style:solid none solid solid;

border-color:#999999;

}

.visoft__tab_xpie7 .ajax__tab_tab

{

padding: 4px 30px;

width:80px;

}

.visoft__tab_xpie7 .ajax__tab_body

{

font-family: verdana,tahoma,helvetica;

border: 1px solid #999999;

border-top: 0;

padding: 4px;

background-color: #ffffff;

color: #FF9966;

font-size: 18px;

}

.visoft__tab_xpie7 .ajax__tab_active .ajax__tab_inner

{

border: 1px;

border-style:solid none none solid;

border-color:#999999;

background-color: #ffffff;

}

<ajaxToolkit:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" Height="300px"

CssClass="visoft__tab_xpie7">

<ajaxToolkit:TabPanel ID="TabPanel1" runat="server" TabIndex="0" HeaderText="Listing">

<ContentTemplate>

ContentTemplate>

ajaxToolkit:TabPanel>

ajaxToolkit:TabContainer>



0 comments: