Question

在webkit浏览器中，此页面呈现正常：

http://www.ryanhaywood.com/s/film.html

但是在更新的Firefox中，它的间隔非常大。我已经在firebug中搞砸了几天，我不知道如何在firefox中解决这个问题。

我为上述页面中部署的古老解决方案（表格）道歉

有人能发现问题吗？

提前致谢莱恩

Answer 1

您已经表示创建表格的布局已过时，我绝对同意。这是一个使用<div>的解决方案，应该可以在所有浏览器中使用

示例：http://jsfiddle.net/pxfunc/hjgQm/

我用电影的left-orientation和right-orientation交替模式对电影进行了分类：

<div class="left-orientation">
    <a href="#"><img src="http://placehold.it/250x175/ff0" alt="Director's Reel" /></a>
    <p class="title">Director's Reel</p>
</div>
<div class="right-orientation">
    <a href="#"><img src="http://placehold.it/250x175/f00" alt="Nobody's Off The Hook" /></a>
    <p class="title">Nobody's Off The Hook</p>
</div>

我用边距来控制电影在父div中出现的位置

#films div {width:46%;margin-top:-100px;}
#films .left-orientation {text-align:right;}
#films .right-orientation {margin-left:54%}

您可以向上或向下调整#films div {margin-top:-100px;}以适合您想要的高度以抵消胶片

表渲染问题：firefox 4，gecko

1 个答案: