3

我使用角引導翼片作爲,具有不同標題的長度引導翼片具有不同的高度

<tabset> 
    <tab ng-repeat="tab in tabs" ui-sref="{{tab.state}}"> 
    <tab-heading class="navbar-header" style="cursor:pointer;"> 
     <div class="col-md-1" style="width: 130px;"> 
      {{tab.title}} 
     </div> 
    </tab-heading> 
    </tab> 
</tabset> 
<div class="row-fluid"><div class="ui-view-content" ui-view></div></div> 

我面臨與高亮白色爲有源標籤的問題。白色繪製在更小的高度時的標籤的標題是短和更長的高度時的標籤的標題是長

enter image description here enter image description here

角版本是「1.4.1」和角度引導版本是「0.12。 2"

應用CSS:

.nav-tabs > li.active > a, 
.nav-tabs > li.active > a:hover, 
.nav-tabs > li.active > a:focus { 
    color: #555555; 
    cursor: default; 
    background-color:  #ffffff; 
    border: 1px solid #dddddd; 
    border-bottom-color: transparent; 
} 

如何確保所選擇的標籤標題的白顏色是統一的高度嗎?

回答

1

您是否嘗試過使用white-space: nowrap?它基本上強制文本不換行到下一行。非常容易使用。這是一個例子。

CSS:

.nav-tabs li, .nav-tabs a { 
    white-space:nowrap; 
    overflow: hidden; 
} 

Working Example

如果上述方法無效,無論出於何種原因,可以嘗試設置max-height

+1

我的標籤串看起來比以前更好的..謝謝 –

0

我相信你不能在CSS中實現這一點。您將不得不使用JavaScript來查找具有最大高度的選項卡,並將該​​高度應用於其餘的選項。

這個職位的東西,將有助於在腳本 - jQuery Equal Height Divs