开发者

How do I prevent extra space below text in a table cell?

开发者 https://www.devze.com 2023-04-05 11:26 出处:网络
I need some help. I am trying to prevent extra space from occurring below the bottom line of text in a table cell. (the table has a rollover link and the text has a 85% line height that are both neede

I need some help. I am trying to prevent extra space from occurring below the bottom line of text in a table cell. (the table has a rollover link and the text has a 85% line height that are both needed) I've开发者_如何学运维 also tried CSS to set the line height but same problem. The 3 column table needs to stay at 46px high but expands to 57px high when altering the line height to 85% which is needed. This will be used on a mobile webpage. A solution would be VERY, VERY appreciated. thanks.

link to the webpage: 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>


<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>

Does that fix it? (margin-bottom:0px;)


Thanks. That got rid of the space at the bottom but the 2 lines of text needs to be centered vertically in the cell with the cell staying at 46px high. I apologize I didn't mention that it needed to be centered vertically. But I think I'm on the doorstep of a solution. (been Googling for 2 days for an answer to this!) Got if under control. I added a margin-top:8px; with the margin-bottom:3px; and was able to totally control the vertical position. thanks for all the help.

the resulted code fix: (showing only the first line)

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

精彩评论

暂无评论...
验证码 换一张
取 消