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
Marcus Turnbull
300
WebTab container top boder cutting through active tab
posted

Hi All

Does anyone know of a way to get a border across the top of the container (bottom of the tab holder) without it cutting through the active tab?  Would have thought this would be a normal tab layout/design - but doesn't seem possible with their CSS classes that are available.

Setting the THContentHolder top border and the THHolder bottom border both result in a border which goes all the way across.  I can live with the border going through the bottom of the non-active tabs, but it looks stupid cutting through the active tab.

See image below - border shown in red to highlight it.

Thanks

Marcus

Parents
No Data
Reply
  • 20255
    Offline posted

    Hello Marcus,
     I have made you a sample that shows how to handle the cutting through the active tab. In TabItemCssClasses of the WebTab just set this class: 

    .TabBorder
     {
           background-image: none;
           height: 40px !important;
           padding-left: 1px !important;
     }


     Its tested on Chrome, Mozilla and IE and it works like a charm. Here you can see sample that shows you how to set custom styles for WebTab. Take a look at the source for the various properties you can target for different parts of the control.
     Thank you for posting in our forum and feel free to contact me at any time.

    TabContainerExample.zip
Children