Question

使用IE或Chrome查看此内容并注意黄色块： http://vansschoenenonline.com/portfolio/vans-era-goldcoast-ginger-bread/

现在在firefox中打开相同的页面，魔法就发生了......块就消失了。

有谁知道是什么原因造成的？我做错了吗？

Answer 1

您的HTML无效：

<h5><h2>Goedkoopste shop:</h2></h5>

标题不能嵌套，浏览器会按错误进行操作，每个标题可能不同。

http://validator.w3.org/check?uri=http%3A%2F%2Fvansschoenenonline.com%2Fportfolio%2Fvans-era-goldcoast-ginger-bread%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

验证输出：2个错误

第154行，第84栏：标题不能是另一个标题的子项。   …10px 0 -5px 3px;; margin-bottom:-5px;">Goedkoopste shop:</h2></h5><span style=…

第154行，第111栏：迷路结束标记   H5 即可。 …ttom:-5px;">Goedkoopste shop:</h2></h5><span style="margin-left:3px;">Fresh Co…

Answer 2

只需从position:relative类中删除.single-portfolio .entry-content，然后在div样式left: 0; top: 314px;中添加这些属性，其中保留“Goedkoopste shop：”文本
它可能对你有帮助

Answer 3

原因在于style.css：

.single-portfolio .entry-content .entry-meta { 
    left: 0; 
    width: 220px;
}

.gecko.single-portfolio .entry-content .entry-meta { left: -240px; }

left:xxx对div.entry-meta申请.gecko.single-portfolio时存在歧义。 Firefox应用最后一个，与Chrome和IE相反（他们可能认为第一个left: -240px;使整个规则无效）。

如果您使用Firefox开发人员工具，您会看到应用.gecko.single-portfolio .entry-content .entry-meta { left: -240px; }的人。如果取消选中它，您的块就会像在其他浏览器中一样显示。

如果删除此行：

{{1}}

（或使它不适用于此块）它会没问题

阻止不会在Firefox中显示

3 个答案: