Question

我需要一些帮助。我试图防止在表格单元格的文本底线下面发生额外的空间。（该表有一个翻转链接，文本有85％的行高，这两者都是必需的）我也尝试过CSS来设置行高但同样的问题。 3列表需要保持在46px高，但在将线高度改为85％时需要扩展到57px。这将用于移动网页。一个解决方案将非常，非常赞赏。感谢。

链接到网页：http://www.m.dcgraphicsandphotography.com/table_BG_test10.html

    <table class="dsR62" border="0" cellpadding="0" cellspacing="0">
        <tr onmouseover="this.style.background='url(images/button_BG_ov.jpg)';this.style.cursor='pointer'" onmouseout="this.style.background='url(images/button_BG.jpg)';" onclick="DoNav('dvd.html/');">
            <td class="dsR23">
                <div align="right">
                    <img src="images/ICON-RGB.gif" alt="" height="39" width="40" border="0" /></div>
            </td>
            <td class="dsR50">
                <div align="left">
                    <p style="line-height:85%;"><span class="ds3"><span class="ds4">DVD TRANSFERS</span></span><span class=""><span class="ds3"><span class="ds3"><br />
                                </span></span></span><span class="ds3"><span class="ds5">From videos, photos and slides</span></span></p>
                </div>
            </td>
            <td class="dsR25"><img src="images/button_arrow.gif" alt="" height="36" width="35" border="0" /></td>
        </tr>
    </table>

Answer 1

<p style="line-height:85%; margin-bottom: 0px;">
   <span class="ds3">
       <span class="ds7">DVD TRANSFERS</span>
    </span>
    <span class="ds6">
        <span class="">
            <span class="ds3">
                <span class="ds3">
                    <br>
                </span>
            </span>
        </span>
    </span>
    <span class="ds3">
        <span class="ds8">From videos, photos and slides</span>
    </span>
</p>

这样可以解决吗？（margin-bottom:0px;）

Answer 2

感谢。这摆脱了底部的空间，但是2行文本需要在单元格中垂直居中，单元格保持在46px高。我道歉，我没有提到它需要垂直居中。但我想我就在解决方案的门口。（谷歌搜索了2天的答案！）如果得到控制。我添加了一个保证金：8px;保证金底部：3px;并能够完全控制垂直位置。感谢所有的帮助。

结果代码修复:(仅显示第一行）

<p style="line-height:85%; margin-top: 8px; margin-bottom: 3px;">

如何防止表格单元格中文本下方的额外空间？

2 个答案: