Remove tab on jQuery UI tab

Question

I want to move the text closer to the left ...

ok with the image above, I want to override the filling of my jquery-ui-tab page. I already tried the code below, but it doesn't seem to work.

$(".ui-tabs.panel").css('padding','0px'); 

Now, how can I make this possible ?,

NOTE : I want to override css or jquery, and I don't want to change any jquery-ui css files

Answer 1

You can do this with simple css; try this for example:

Include this in your main stylesheet:

 .ui-tabs .ui-tabs-panel { padding: 1em 1.4em 1em 0; } 

Answer 2

Old question, but it works beautifully. Assuming you have a div with class "style-tabs", for example:

 <div id="tabs" class="style-tabs"> <ul> <li><a href="ajax/MyTab.php">My Tab</a></li> <li><a href="ajax/MyTab2.php">My Tab 2</a></li> <ul> </div> This CSS works nicely (setting a negative margin)... .style-tabs li a { margin: -0.3em; padding: 0; }