Forums Ultimate UI for ASP.NET Web Forms
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Monroe
485
Modified CSS does now work with padded THHolder
posted

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?

 

 

Parents
No Data
Reply
  • 7566
    Verified Answer
    posted

    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">

                       </ig:ContentTabItem>

                  </Tabs>

              </ig:WebTab>

     

    [/code/

     

    I hope this helps. For any further questions do not hesitate to contact me

     

    Sincerely,

    Georgi Sashev

    Developer Support Engineer

    Infragistics, Inc.

    http://ko.infragistics.com/support

Children