CSS文本換行應將浮動元素當作列

這是生成的佈局，文本包裝在標籤「日期」下。 The problem CSS文本換行應將浮動元素當作列

這裏是理想的結果： The desired result

下面是HTML佈局：

<div class="alternate"> 
    <span class="label">Dates:</span> 
    <span id="lblDates"> 
     Created: <u>May 31, 2011</u>, Quote: <u>Sep 1, 2011</u>, Completed: <u>May 23, 2012</u>, Invoice: <u>May 1, 2011</u>, Finalized: <u>May 31, 2011</u> 
    </span> 
    <br style="clear:both;"> 
</div>

相關的CSS：

fieldset .label { 
     text-align: right; 
     float: left; 
     width: 150px; 
     clear: left; 
     margin-right: 15px; 
     color: black; 
     font-weight: bold; 
}

如果我把一個預定高度到標籤，然後它的作品，但我不知道我不希望標籤上有預定義的高度，因爲有時我只有一行內容，我該如何實現？

謝謝！

來源

2012-05-24 EtienneT

這應該有助於

#lblDates { 
    padding-left: 165px; 
    display: block; 
}

這裏是working example

來源

2012-05-24 14:59:31 archil

任何方式做到這一點，而不是硬編碼在另一個跨度的寬度？ –

在硬編碼下，你的意思是給出跨度寬度還是以像素爲單位給出跨度寬度？我的意思是，相對寬度是微不足道的，使用百分比 – archil

不，我的意思是第二個跨度必須始終與第一個跨度相協調。如果另一種樣式會影響標籤的寬度，則還必須更改lblDates填充。 –

把margin-left: 165px（165像素= 150像素+ 15像素，寬度+餘量您在標籤上設置）和display:block上#lblDates

來源

2012-05-24 14:52:50 Ana

CSS文本換行應將浮動元素當作列

回答

相關問題