2015-10-17 71 views
-1

我有包含文本的標籤。當我嘗試使用height:autoheight:100%設置高度時,它僅在使用px時有效。但是,這樣可以防止在文本較長時擴展選項卡。標籤高度不會隨其內容擴展

這是我的CSS:

.tab-section { 
    float: left; 
    width: 100%; 
    height: 792px; 
    margin-bottom: 25px; 
} 

如何讓我的高度auto

+0

關於使用什麼' overflow:auto;'並添加,例如'max-height:500px;'? –

+0

使用'最小高度:792px' –

+0

「\t 那麼使用溢出:自動和添加,例如最大高度:500px ;?」我已經嘗試過這一點,但與此創建一個靜態容器中的滾動高度,我想頁面的高度是動態的,當標籤內容變化時 – SURTLER77

回答

0

這是因爲您在裏面顯示標籤內容 li元素。 作爲li這是一個菜單,它看起來像一個破碎的佈局。

您應該在選項卡部分之外顯示標籤內容。 另外要注意的浮動(例如,如果父已浮動:左,孩子也應該有浮動:左履行家長的高度)

0

.tab-contentposition:absolute

Based on feeela answer

絕對定位元素從流中移除,因此被其他元素忽略。所以你不能根據絕對定位的元素設置父母的身高。

你可以使用這個腳本來處理它:

$("[type = radio]").click(function() { 
    var oh=$(this).parent().find(".content").outerHeight();  
    $(".tabs").height(oh); 
}); 

Fiddle demo

您也可以使用視臺(VH)或ul.tabs(CSS3)計算()