儘量減少線路之間的距離的跨度，使得用CSS

我有以下的HTML儘量減少線路之間的距離的跨度，使得用CSS

<td valign="top" id="oddnumberedcolumns"> 
    <div><a><span class="myspan">line 1 without linebreak</span></a></div> 
    <div><a><span class="myspan">line 2 without linebreak</span></a></div> 
</td> 
<td valign="top" id="oddnumberedcolumns"> 
    <div><a><span class="myspan">A very looooooong line 3&#039;which results in a line break due defined width of table column</span></a></div> 
</td>

CSS換行符：

font-weight: normal; 
color: #333 !important; 
font-size: 11px; 
line-height: 22px; 
border-collapse: separate; 
border-spacing: 2px; 
font-family: Verdana, sans-serif;

我的問題是線之間的距離1 & 2與第3行相同的是「換行符」，所以它看起來有四個鏈接，實際上只有3個鏈接。如何最小化第3行中「中斷」字母之間的距離，並保持第1行之間的距離不變。我寧願改變它在CSS中，並保持原樣。希望你明白我的意思是通過「換行」 - 我也許並虐待它有點...

來源

2011-08-16 lmkk

你能設置一個小提琴嗎？ – PeeHaa

「js」類的「小提琴」：http://jsfiddle.net/ – thirtydot

在這種情況下，你可以在DIV設置bottom-margin到前兩個環節之間給予空間，並降低你的line-height對TD從22px到的東西比font-size

例如高一點：http://jsfiddle.net/qwane/

td { 
    font-weight: normal; 
    color: #333 !important; 
    font-size: 11px; 
    line-height:15px; 
    padding:10px 0; 
    border-collapse: separate; 
    border-spacing: 2px; 
    font-family: Verdana, sans-serif; 
    width:300px; 
} 
div {margin-bottom:11px;}

來源

2011-08-16 21:56:02 MikeM

修改的line-height值。要注意的是行高僅適用於塊元素，所以你應該把它分配給您的<DIV>

這裏是一個小的重寫，應該幫助你：http://jsfiddle.net/GhMar/1/

還注意到，你不能有兩個（你有兩個「oddnumberedcolumns」）

來源

2011-08-16 21:58:54 red

儘量減少線路之間的距離的跨度，使得用CSS

回答

相關問題