Question

我有一个空的div，它有背景颜色和填充。登录后，空div会被填充。

如果我没有登录，则空的div现在不应该显示在ff中它没有显示但是在chrome中，空的潜水显示为带有背景颜色的方形。我无法删除背景或填充（因为不想删除它，然后使用jq添加它。）

#login {
    background-color: #263171;
    color: #FFFFFF;
    display: inline-table;
    float: right;
    font-size: 12px;
    margin-top: 20px;
    padding: 10px;
}
<div id="login"></div>

任何想法为什么它以这种方式行事？

感谢

Answer 1

OP是对的。 Firefox中存在一个错误，导致此错误已经提交。

错误来自显示：内联 -table 。无论是什么都包括'桌子'。

尝试从display：inline-table更改为inline-block或inline。

Answer 2

这是因为你有20px的填充，显示像40px x 40px的深蓝色方块。元素的边框包括填充，因此其宽度和高度将为40px。

此外，它应该在Firefox以及其他浏览器中显示，也许你没有看到它？ [编辑]：似乎是Firefox中与内联表相关的错误。

如果您想隐藏某些内容，请根据您的使用情况使用display:none或visibility:hidden。

不要使用空元素进行间距，对要分隔的元素使用边距或填充。

还有一件事：使用inline-table来隐藏它是没有意义的。

带有填充的空div显示在chrome中但不在ff中

2 个答案: