如何让桌子完全填满面板?

时间:2016-02-28 14:11:32

标签: html css asp.net

例如,我在面板内创建了一个带有桌子的面板。面板尺寸为500 x 280。

<asp:Panel ID="welcomePanel" runat="server" BorderColor="Black" BorderWidth="3px" Height="280px" Width="500px" BackColor="White">
    <table class="tableInPanel">
        <tr>
            <td colspan="2" style="background-color: #F0F0F0"><strong><span>Welcome To</span><br/><span>my website</span></strong></td>
        </tr>
        <!-- more rows...-->
    </table>
</asp:Panel>

这是我桌上的CSS:

.tableInPanel {
    width: 500px;
    height: 280px;
    height: 100%;
    margin-bottom: 0px;
}

唯一的问题是它在Google Chrome中不起作用,表格的底部超出了面板的高度,因此表格掩盖了面板的底部边框(看起来很丑陋)。但是,它在Firefox和IE中完美运行。至于Safari,桌子的底部略大于应有的位置,并覆盖底部边框的一点点。

有没有更好的方法或替代方法来确保它始终有效并在不同的浏览器中正常工作?

在Firefox中看起来像什么: Image in FireFox

Google Chrome中的外观如下: Image in Chrome

0 个答案:

没有答案