Hi, Telerik Team
after updating from version 2008.3.1314.35 to version 2009.1.527.35 I have lost the design of my TabStrip [Azul], the design "is broken". I explain:
I have a TabStrip (RadTabStrip1)
The code the .aspx is as below:
My skin "Blue" could handle the padding-left and padding-right, but now, it's not possible.
The code the TabStrip.Azul.css is as below:
I have done a new skin (Skin_TabStrip2), more "simple" from skin "WebBlue" and I can't adjust the padding-left and padding-right.
The code the RadTabStrip.Skin_TabStrip2.css is as below:
I need some help for impleting this.
Thanks for you help,
Jorge Saa-Gerbier
after updating from version 2008.3.1314.35 to version 2009.1.527.35 I have lost the design of my TabStrip [Azul], the design "is broken". I explain:
I have a TabStrip (RadTabStrip1)
The code the .aspx is as below:
<telerik:RadTabStrip |
ID="RadTabStrip1" |
SelectedIndex="0" |
runat="server" |
MultiPageID="RadMultiPage1" |
CssClass="tabStrip" |
EnableEmbeddedSkins="False" |
Skin="Azul" |
> |
My skin "Blue" could handle the padding-left and padding-right, but now, it's not possible.
The code the TabStrip.Azul.css is as below:
.RadTabStrip_Azul |
{ |
line-height: 0; |
font-size: 0; |
} |
.RadTabStrip_Azul .rtsLI, |
.RadTabStrip_Azul .rtsLink |
{ |
color: #003366; |
height:28px; |
} |
.RadTabStrip_Azul .rtsLink |
{ |
text-decoration: none; |
font-family: tahoma, Verdana, Arial, Helvetica, sans-serif; |
font-size: 12px; |
line-height: 28px; |
} |
/* ------------------------------------------------------------------------------- */ |
/* disabled tabs */ |
.RadTabStrip_Azul .rtsDisabled |
{ |
color: #95D5FF; |
cursor: default; |
} |
.RadTabStrip_Azul_disabled .rtsDisabled |
{ |
color: #95D5FF; |
cursor: default; |
} |
/* ------------------------------------------------------------------------------- */ |
.RadTabStrip_Azul .rtsImg |
{ |
border:0; |
vertical-align:top; |
width: 30px; |
margin: 2px 0; |
} |
.RadTabStrip_Azul .rtsTxt |
{ |
padding: 0px 0px 0px 50px; |
} |
.RadTabStrip_Azul .rtsLink |
{ |
padding-left: 5px; |
} |
/* Orientation: Top */ |
.RadTabStrip_Azul .rtsLink |
{ |
padding-right: 0px; /* Cambiado por mi */ |
padding-left: 32px; |
} |
.RadTabStrip_Azul .rtsLast .rtsLink |
{ |
padding-right: 16px; |
padding-left: 16px; |
} |
.RadTabStripTop_Azul .rtsIn |
{ |
padding: 4px 0px 4px 32px; |
} |
.RadTabStripTop_Azul .rtsLink { background: transparent url('TabStrip/TabStripStates.gif') no-repeat 100% -56px; } |
.RadTabStripTop_Azul .rtsLink .rtsOut { background: transparent url('TabStrip/TabStripStates.gif') no-repeat 0 -84px; } |
.RadTabStripTop_Azul .rtsFirst .rtsLink .rtsOut { background-position: 0 0; } |
.RadTabStripTop_Azul .rtsLast .rtsLink { background-position: 100% 0; } |
/* ------------------------------------------------------------------------------- */ |
.RadTabStripTop_Azul .rtsLink:hover |
{ |
color: #95D5FF; |
} |
.RadTabStripTop_Azul .rtsSelected |
{ |
color: #FFFFFF; |
} |
/* ------------------------------------------------------------------------------- */ |
.RadTabStripTop_Azul .rtsSelected { background-position: 100% -84px; } |
.RadTabStripTop_Azul .rtsFirst .rtsSelected .rtsOut, |
.RadTabStripTop_Azul .rtsSelected .rtsOut { background-position: 0 -28px; } |
.RadTabStripTop_Azul .rtsLast .rtsSelected { background-position: 100% -28px; } |
.RadTabStripTop_Azul .rtsAfter .rtsOut { background-position: 0 -56px; } |
.RadTabStripTop_Azul .rtsDisabled.rtsAfter .rtsOut { background-position: 0 -56px; } |
.RadTabStripLeft_Azul .rtsIn { padding: 4px 15px 4px 15px; } |
.RadTabStripLeft_Azul .rtsLast .rtsIn { padding-bottom: 4px; } |
.RadTabStripLeft_Azul .rtsLI .rtsLink { padding: 0; } |
/* ------------------------------------------------------------------------------- */ |
.RadTabStripLeft_Azul .rtsLink:hover |
{ |
color: #ffffff; |
} |
.RadTabStripLeft_Azul .rtsSelected |
{ |
color: #ffffff; |
} |
/* ------------------------------------------------------------------------------- */ |
.RadTabStripLeft_Azul .rtsSelected { background-position: 0 -28px; } |
I have done a new skin (Skin_TabStrip2), more "simple" from skin "WebBlue" and I can't adjust the padding-left and padding-right.
The code the RadTabStrip.Skin_TabStrip2.css is as below:
.RadTabStrip_Skin_TabStrip2 |
{ |
} |
.RadTabStrip_Skin_TabStrip2 .rtsLI, |
.RadTabStrip_Skin_TabStrip2 .rtsLink |
{ |
color: #000; |
font: 12px/26px tahoma, Verdana, Arial, Helvetica, sans-serif; |
} |
.RadTabStrip_Skin_TabStrip2 .rtsLI, |
.RadTabStrip_Skin_TabStrip2 .rtsLink |
{ |
color: #fff; |
} |
.RadTabStrip_Skin_TabStrip2 .rtsLink:hover, |
.RadTabStrip_Skin_TabStrip2 .rtsSelected |
{ |
color: #0f3789; |
} |
.RadTabStripLeft_Skin_TabStrip2 .rtsSeparator, |
.RadTabStripRight_Skin_TabStrip2 .rtsSeparator |
{ |
background: #3D556C; |
} |
/* <disabled tabs> */ |
.RadTabStrip_Skin_TabStrip2 .rtsLevel .rtsDisabled, |
.RadTabStrip_Skin_TabStrip2 .rtsLevel .rtsDisabled:hover |
{ |
color: #0f3789; /* dddddd */ |
} |
/* </disabled tabs> */ |
/* <tab backgrounds> */ |
.RadTabStripTop_Skin_TabStrip2 .rtsLevel { background-color: transparent; } |
.RadTabStripTop_Skin_TabStrip2 .rtsLevel .rtsLink, |
.RadTabStripTop_Skin_TabStrip2 .rtsLevel .rtsOut, |
.RadTabStripBottom_Skin_TabStrip2 .rtsLevel .rtsLink, |
.RadTabStripBottom_Skin_TabStrip2 .rtsLevel .rtsOut, |
.RadTabStripTop_Skin_TabStrip2_Baseline .rtsLevel, |
.RadTabStripBottom_Skin_TabStrip2_Baseline .rtsLevel { background-image: url('TabStrip/TabStripStates.png'); } |
/* </tab backgrounds> */ |
/* <background positioning: tabs with hovers> */ |
/* <orientation: top> */ |
.RadTabStripTop_Skin_TabStrip2 .rtsLink { background-position: 0px 0px; } |
.RadTabStripTop_Skin_TabStrip2 .rtsOut { background-position: 100% 0px; } |
.RadTabStripTop_Skin_TabStrip2 .rtsLink:hover { background-position: 0px -52px; } |
.RadTabStripTop_Skin_TabStrip2 .rtsLink:hover .rtsOut { background-position: 100% -52px; } |
.RadTabStripTop_Skin_TabStrip2 .rtsSelected, |
.RadTabStripTop_Skin_TabStrip2 .rtsSelected:hover { background-position: 0px -26px; } |
.RadTabStripTop_Skin_TabStrip2 .rtsSelected .rtsOut, |
.RadTabStripTop_Skin_TabStrip2 .rtsSelected:hover .rtsOut { background-position: 100% -26px; } |
.RadTabStripTop_Skin_TabStrip2 .rtsDisabled:hover { background-position: 0px 0px; } |
.RadTabStripTop_Skin_TabStrip2 .rtsDisabled:hover .rtsOut { background-position: 100% 0px; } |
.RadTabStripTop_Skin_TabStrip2_Baseline .rtsLevel { background-position: 0px 100%; background-repeat: repeat-x; } |
/* </orientation: top> */ |
/* </background positioning: tabs with hovers> */ |
.RadTabStrip_Skin_TabStrip2 .rtsText |
{ |
} |
I need some help for impleting this.
Thanks for you help,
Jorge Saa-Gerbier