JQuery UI Tabs size

i have a problem with the tab size in jquery UI , they are HUGE .. i changed a bit the css but cant find the propper id/class to fix it .. :(

and the text inside the tab aslo changes size :S as always , any change开发者_运维知识库 is appreciated Thanks!

modifying the .ui-tabs jquery ui theme class to include the font-size property will resolve this.

The text size is defined in .ui-helper-reset by default, but it might be overriden by the CSS of the active theme. When in doubt, fire up Firebug and use the Inspect button to find out the CSS definitions for the element in question.

I use body {font-size:62.5%;}

I hope this question is similar to the question in reducing the height of jquery ui tabs..

From there i found this info to be useful for you..

.ui-tabs .ui-tabs-nav li {height: 25px; font-size:12px; }

Just change padding property for li a element

i.e., by default padding property for li a { padding:0.5em 1em;} You can override the above property to meet your requirement .

There are some good ideas here: http://keith-wood.name/uiTabs.html

Essentially, create a css class like this:

.my-tabs .ui-tabs-nav li { font-size: 10pt; }

Then use this class in your tab's :

Written while listening to Beethoven's Piano Concerto No. 1 in C, Op. 15 - 3. Rondo. Allegro scherzando.