空div最小文本高度

-1

如何給一個空div的最小高度等於文本高度？空div最小文本高度

在這個例子中有多個標籤/值對。而一些值爲空

如何給空值容器的最小高度爲文本高度？

注意

這不是一個表的佈局。每個標籤/值具有不同的寬度

的jsfiddle

http://jsfiddle.net/p2ekqomj/9/

代碼

<div> 
    <div class="input_label" style="width:80px"> 
     <div class="input_label label">Label 1</div> 
     <div class="input_label_value">Value 1</div> 
    </div> 
    <div class="input_label" style="width:100px"> 
     <div class="input_label label">Label 2</div> 
     <div class="input_label_value"></div> 
    </div> 
</div> 
<div> 
    <div class="input_label" style="width:50px"> 
     <div class="input_label label">Label 3</div> 
     <div class="input_label_value"></div> 
    </div> 
</div> 
<div> 
    <div class="input_label" style="width:60px"> 
     <div class="input_label label">Label 4</div> 
     <div class="input_label_value"></div> 
    </div> 
    <div class="input_label" style="width:80px"> 
     <div class="input_label label">Label 5</div> 
     <div class="input_label_value">Value 5</div> 
    </div> 
</div> 
<div> 
    <div class="input_label" style="width:120px"> 
     <div class="input_label label">Label 6</div> 
     <div class="input_label_value"></div> 
    </div> 
</div> 

.input_label { 
    display:inline-block; 
    padding:2px; 
    vertical-align: top; 
} 

.input_label.label { 
    font-size:11px; 
}

來源

2015-02-11 clarkk

我不知道你需要... ...如果你追求的是比對，那麼你可以是這樣做的 - http://jsfiddle.net/p2ekqomj/2/ – 2015-02-11 15:17:26

這真的看起來像一個表佈局，即使你用css - [看這個例子]（http://jsfiddle.net/p2ekqomj/3/）。我建議你使用表格。 – skobaljic 2015-02-11 15:19:29

@ paulie_d，這個工作..但是如果有多個在彼此之上..如果一個「行」的值是空的，你有同樣的問題..沒有空間http://jsfiddle.net/p2ekqomj/5/ – clarkk 2015-02-11 15:24:19

更改顯示屬性從.input_labelinline-block到table-cell：

.input_label { 
    display:table-cell; 
    padding:2px; 
}

jsFiddle example

來源

2015-02-11 15:19:41 j08691

這和他第一次使用表格一樣。他使用錯誤的標記，錯誤的類屬性，一切都是錯誤的，因爲表格數據應該在表格中。 – skobaljic 2015-02-11 15:23:09

@skobaljic - 我不知道你在說什麼。你在哪裏看到「他使用桌子的第一名」？儘管表格應該用於表格數據，但使用CSS表格單元格樣式適用於任何元素。它只是造型而沒有語義價值。 – j08691 2015-02-11 15:24:29

這不是一個表..每個「細胞」有不同的寬度 – clarkk 2015-02-11 15:25:06

空div最小文本高度

回答

相關問題