造型jquery-ui標籤

我正在玩jquery選項卡，嘗試以我認爲合適的方式對它們進行樣式設計。我試圖縮小這些標籤，並在UI樣式表中添加一個height:45px;，如下所示。造型jquery-ui標籤

.ui-tabs-vertical .ui-tabs-nav li { 
    clear: left; 
    height:45px; 
    width: 100%; 
    border-bottom-width: 1px !important; 
    border-right-width: 0 !important; 
    margin: 0 -1px .2em 0; 
}

然而，不是縮小所有的標籤，而是保持一個（最後一個）不變。在這裏可以看到標籤爲Trash JS-FIDDLE demo的標籤。我想了解正在發生的事情以及我如何解決這個問題。此外，任何其他編碼技巧將不勝感激。

來源

2012-12-19 Octavius

的li內部的錨定標記比li更高。如果你限制了這個高度，它可以工作。

.ui-tabs-vertical .ui-tabs-nav li a { height: 30px; }

See updated fiddle

我只注意到與你的標籤是重疊的Chrome開發者工具。只有最後一個沒有重疊，因此看起來比其他人高。

來源

2012-12-19 07:44:08

我已經修正了稍微的另一種方式，應用'overflow：hidden'到'.accordion li'規則：http://jsfiddle.net/gYfQD/ – keaukraine

@keaukraine如果你看起來很近，你會看到您的解決方案沒有標籤周圍的邊框，所以它可能需要一些額外的樣式才能在底部後面獲得邊框 –

謝謝您指出這一點。你的解決方案真的看起來更好:) – keaukraine

首先shirink的字體大小在插件

.ui-widget{font-family:Arial,sans-serif;font-size:medium}

來源

2012-12-19 07:41:35

與此高度將播放解決這一問題：

.accordion LI> A {高度：30PX重要; }

來源

2012-12-19 07:48:47 gotqn

造型jquery-ui標籤

回答

相關問題