對齊問題

我有以下的HTML對齊問題

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 

    <html> 

................. 
.... 
....... 

<td colspan="4" ><br>&lt;40  : Negative<br>40-80 : positieve <br></td>

它導致下面的HTML

40:Negative 
40-80:Positive

我需要的是

40 :Negative 
40-80:Positive

是有可能使用CSS來做到這一點？或者其他方式？

來源

2011-03-30 balalakshmi

可以使用<pre>

<td colspan="4" > 
     <pre> 
&lt;40 : Negative 
40-80 : positieve 
     </pre> 
    </td>

來源

2011-03-30 13:39:25 manji

你可以用不間斷空格字符替換你的空間，

<td colspan="4" ><br>&lt;40&nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;: Negative<br>40-80nbsp;nbsp;nbsp;nbsp;: positieve <br></td>

來源

2011-03-30 13:37:20 Canuteson

謝謝，但這個內容來自動態來源。所以無法預測 ; :( – balalakshmi 2011-03-30 13:38:27

好吧，如果你不反對使用表（它看起來像你不是:)），那麼只要堅持在一個表太：

<td> 
    <table> 
    <tbody> 
     <tr><td>&lt;40</td> <td>:Negative</td></tr> 
     <tr><td>40-80</td> <td>:Positive</td></tr> 
    </tbody> 
    </table> 
</td>

來源

2011-03-30 13:38:23 Groovetrain

您正在使用換行符（<br>），而不是一個新的<td>行。如果不查看佈局的其餘部分，則無法使用空格（ ）僅使用一行來排列這些空間，也無需將這些數據進一步拆分爲2列。

來源

2011-03-30 13:38:31

將您的數字包括在範圍內，並給它一些寬度。

爲什麼你有這個<br>標籤？

來源

2011-03-30 13:38:50 Headshota

這裏是一個可能的解決方案（的jsfiddle：http://jsfiddle.net/rcravens/hwGrj/）

<table> 
    <td> 
     <span class='item'> 
      <span class='num'>40</span> 
      <span class='posneg'>:Negative</span> 
     </span> 
     <span class='item'> 
      <span class='num'>40-80</span> 
      <span class='posneg'>:Positive</span> 
     </span> 
    </td> 
</table> 

span.item{ 
display: block; 
} 
span.num{ 
display: inline-block; 
width: 40px; 
}

該解決方案與您的表使用的CSS佈局。你需要將你的元素包裝在幾個跨度中。

希望這會有所幫助。

鮑勃

來源

2011-03-30 13:45:04 rcravens

您可以使用<pre>標籤，它顯示在一個固定寬度字體的文本，並保留兩個空格和換行

<td><pre>40 :Negative</pre></td>

默認樣式可以但用CSS來覆蓋。

來源

2011-03-30 13:45:31 Corneliu

回答

相關問題