Question

我有这个模板用于所有页面。

<table CELLPADDING=0; CELLSPACING=0; style="width:100%; min-height:100vh;">
    <tr>
        <td style="vertical-align:top;">
            [EP_CA:Header]
        </td>
    </tr>
    <tr>
        <td style="align:center; vertical-align:top; width:100%;">
            [EP_CA:Menu]
        </td>
    </tr>
    <tr>
        <td style="align:center; vertical-align:top; width:100%;">
            [EP_CA:SiteMap]
        </td>
    </tr>
    <tr>
        <td style="align:center; vertical-align:top; width:100%; height:100%">
            [EP_CA:Body]
        </td>
    </tr>
    <tr>
        <td class="footerBottom" style="vertical-align:bottom;">
            [EP_CA:Footer]
        </td>
    </tr>
</table>

我为页脚td尝试了display =“block”，但这也没有用。

编辑：我正在尝试将页脚行对齐到页面底部，即使内容较少。该代码适用于chrome，它只是没有响应的firefox。

Answer 1

如果您使用的是HTML5，则valign将无效。

使用CSS。

Answer 2

改变最小高度：100vh到高度：100vh。它对我有用。

Answer 3

使用CSS，您应该应用vertical-align。 valign not working on a td?

td {vertical-align:top;}

Answer 4

对于跨浏览器的兼容性，我建议你不要使用table属性而是使用...

<div> Header </div>
<div> Menu </div>
<div> SiteMap </div>
<div> Body </div>
<div position:relative; bottom:0px;"> Footer </div>

为什么valign =“bottom”在firefox中不起作用，适用于IE和Chrome？

4 个答案: