0

我有一个简单的登录页面的表。我没有坚持这一点，因为我知道我可以把桌子拆开并以另一种方式进行样式设置，但似乎 colspan 在 Firefox 中被破坏了。

HTML

<table>
    <tbody>
        <tr>
            <td>E-mail:</td>
            <td colspan="2">
                <input type="textbox" name="email">
            </td>
        </tr>
        <tr>
            <td>Password:</td>
            <td colspan="2">
                <input type="password" name="password">
            </td>
        </tr>
        <tr>
            <td colspan="3">
                <input type="submit" value="Login">
            </td>
        </tr>
        <tr>
            <td colspan="2">Forgot your password?</td>
            <td style="width: 70px;"><a href="reset.php">Reset It</a>
            </td>
        </tr>
        <tr>
            <td colspan="2">Don't Have an Account?</td>
            <td><a href="create.php">Make One</a>
            </td>
        </tr>
    </tbody>
</table>

CSS

table {
    width: 250px;
}
td:last-child {
    text-align: right;
}

这是我表的 jsFiddle。在 Chrome 或 IE 中查看此表，您可以看到我正在尝试做的事情，即让电子邮件和密码的输入框与“忘记密码”和“没有帐户”这两个词重叠。所以 colspan 应该在 chrome 和 IE 中进行重叠，但在 Firefox 中没有。为什么它在 Firefox 中失败？

4

1 回答 1

3

在我看来，Firefox 正确显示它。文本在 IE 和 Chrome 中溢出。您实际上需要有 3 列才能使您colspan的 s 工作：

<table>
  <tbody>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
...
于 2013-01-28T19:21:42.573 回答