This is the generated code from the tab.
<div class="ig_Control igtab_THControl" id="EmployeeRequestTab" style="min-width: 985px; width: 985px; height: 437px; visibility: visible; overflow: hidden;" oBackColor="White" control="[object Object]" name="EmployeeRequestTab" CtlMain="layout">
<span class="ig_TabBar igtab_THHolder" id="x:378082248.0:mkr:head" _events="[object Object]" mkr="head">
...
So to make your tab match the company standard, I need to add some padding to the left of the span. Problem is that when I do that it then pokes out the side. The div with overflow set to hidden does not seem to cut it off as I was expecting.
Lets say Our tab background is "Green" . I add padding-left 10px;
Any suggestions?
So this is what our grid looked like before we upgraded.
I have stripped out images out of the new grid
#Grid .ig_TabBar_NoBackGround{
background:none;
}
I set a bunch of style sheets to this.
I need the color to be picked from another products style sheets so images will not work.
I need to redraw the selected tab so they slightly overlap the top of the grid, I also need to add a rounded corner on it. These are the two things causing me grief.
The rest I can get to look fairly close.
Hello Mland,
Can you send me an image to show me what exactly you need to achieve?
I will advise you further.
Thank you in advance.
Sincerely,
Georgi Sashev
Developer Support Engineer
Infragistics, Inc.
http://ko.infragistics.com/support
I need to round the top right corner. Normally I place an image and overlay it. This does not seem to work. Any suggestions?
Hi Mland,
In order to style our controls correctly you need to use their properties and to set the css classes to them. In this case I will recomend you to use the following approach
[code]
<head runat="server">
<title></title>
<style type="text/css">
.classOne
{
padding-left:40px;
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<ig:WebTab ID="WebTab1" runat="server" Height="200px" Width="300px" TabItemCssClasses-CenterCssClass="classOne">
<Tabs>
<ig:ContentTabItem runat="server" Text="Tab 1" MarginLeading="10px" MarginTrailing="5px">
</ig:ContentTabItem>
<ig:ContentTabItem runat="server" Text="Tab 2">
</Tabs>
</ig:WebTab>
[/code/
I hope this helps. For any further questions do not hesitate to contact me