jquery - JQuery UI タブでパディングを削除する

Question

テキストをもっと左に寄せたい...

上の図でわかりました。jquery-ui-tab ページのパディングをオーバーライドしたいと思います。私はすでに以下のコードを試しましたが、うまくいかないようです。

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

どうすればこれを可能にできますか？

注: css または jquery オーバーライドが必要で、jquery-ui css ファイルを変更したくない

Answer 1

プレーンな css でそれを行うことができます。たとえば、これを試してください：

これをメインのスタイルシートに含めます。

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

Answer 2

古い質問ですが、これはうまく機能します。次のような「スタイルタブ」のクラスを持つ包含divがあると仮定します。

<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; 
 }