jquery ui tab styling

April 18, 2010 7:54 PM

Need help styling jquery ui tabs

I'm trying to get rid of the top "bar" across the tabs. Example here. Peeking into the css, it appears that the top bar is linked to the background of the content area, so I'm not sure how to get rid of one without effecting the other.

posted by gwint to Computers & Internet (2 answers total)

Best answer: In the css, remove the padding from .ui-tabs and the border from .ui-widget-content.
posted by Paragon at 8:07 PM on April 18, 2010

Best answer: To elaborate, the padding (line 288 of jquery-ui-1.8.custom.css) of the div is surrounding your nested ul (the tabs), and it will have the same background colour as the rest of the div. Likewise, the border surrounds the whole div, including the tabs.
posted by Paragon at 8:12 PM on April 18, 2010