AJAX Tab Container/Panel Styles

Last post 10-09-2007 11:58 AM by dwhite. 8 replies.

Sort Posts:

  • AJAX Tab Container/Panel Styles

    09-17-2007, 12:51 PM
    • Member
      16 point Member
    • stitz
    • Member since 06-14-2007, 3:43 PM
    • Posts 6

    Hello,

    Has anyone successfully overwridden the AJAX Tab Container styles? When I attempt to create custom styles for the tab container or tabs, all styling goes away completly on the tabs. I must be doing something wrong. Can anyone provide some clear examples of overwriding these styles? Thanks.

  • Re: AJAX Tab Container/Panel Styles

    09-17-2007, 1:34 PM
    • Star
      8,978 point Star
    • dwhite
    • Member since 02-08-2007, 9:25 AM
    • Bristol, CT
    • Posts 1,422
    You can look here: http://www.asp.net/AJAX/Control-Toolkit/Live/Tabs/Tabs.aspx at the Tabs Theming section for how to go about styling the tabs...

    -Damien

    Visoft, Inc - Home | Blogs

    Latest Blog Post: Silverlight DataBinding Bug
  • Re: AJAX Tab Container/Panel Styles

    09-17-2007, 2:06 PM
    • Member
      25 point Member
    • xthjan
    • Member since 06-22-2005, 6:42 PM
    • Posts 18

    I was working with overwridden themes for tabs, but it doesn't work sucessfully. After that, I copy from the masters css style for tabs and paste in my own css, but it doesn't work too...

    It generate a problem in tabs with the margin automaticly assigned.

    Please if someone can do work correctly the tabs whit personalized styles post the correct clases overwridden.

  • Re: AJAX Tab Container/Panel Styles

    09-26-2007, 12:46 AM
    • Member
      16 point Member
    • stitz
    • Member since 06-14-2007, 3:43 PM
    • Posts 6

    I have followed the asp.net/ajax toolkit tab theming information and I am still unable to get the styling to work. When I try to override the styles, I loose all styling all together. Does anyone have examples of working styles for the ajax tabs?

  • Re: AJAX Tab Container/Panel Styles

    09-26-2007, 9:14 PM
    • Star
      8,978 point Star
    • dwhite
    • Member since 02-08-2007, 9:25 AM
    • Bristol, CT
    • Posts 1,422

    I've create a blog entry for you in regards to theming the tabs; along with the source code... http://blogs.visoftinc.com/archive/2007/09/26/ajax-control-toolkit-tab-control-themes.aspx

    Hope this helps.

    -Damien

    Visoft, Inc - Home | Blogs

    Latest Blog Post: Silverlight DataBinding Bug
  • Re: AJAX Tab Container/Panel Styles

    10-08-2007, 7:35 PM
    • Member
      4 point Member
    • Foovanadil
    • Member since 10-05-2007, 4:14 PM
    • Posts 2

     

    I posted on your blog as well but what about styling the individual tab panels seperatley so that I can control each tabs style?

     

    I followed your example and got the container styling working fine but I can't figure out how to control the tab panels individually.

     

    Any ideas.

  • Re: AJAX Tab Container/Panel Styles

    10-09-2007, 5:28 AM
    • Member
      427 point Member
    • niallhannon
    • Member since 03-23-2006, 2:50 PM
    • Posts 125

    Try this link, I came across it today on Silverlight.net...

     http://mattberseth.com/blog/2007/09/more_sample_ajaxcontroltoolkit.html

  • Re: AJAX Tab Container/Panel Styles

    10-09-2007, 11:34 AM
    • Member
      4 point Member
    • Foovanadil
    • Member since 10-05-2007, 4:14 PM
    • Posts 2

    Thanks for the link. It isn't quite what I looking for though. He is placing different icons on the tabs by altering the header template.

     

    What I need to do is give an entirely different style for each tab (header, outer, inner, body, and hover states).  There may be some sort of CSS trick that can be done to accomplish this but my CSS skills are lacking.

     

  • Re: AJAX Tab Container/Panel Styles

    10-09-2007, 11:58 AM
    • Star
      8,978 point Star
    • dwhite
    • Member since 02-08-2007, 9:25 AM
    • Bristol, CT
    • Posts 1,422

    You can assign a custom CSS directly to the tab.  I'm not sure exactly of the syntax for this, but bascially you want to assign the CSS to the SPAN on line 1 in my example

    01 <span id="..." class="ajax__tab_active">
    02   <span class="ajax__tab_outer">
    03     <span class="ajax__tab_inner">
    04       <span id="..." class="ajax__tab_tab">Tab 1</span>
    05    </span>
    06  </span>
    07 </span>

    -Damien

    Visoft, Inc - Home | Blogs

    Latest Blog Post: Silverlight DataBinding Bug
Page 1 of 1 (9 items)