1

我有一个网站在 FF 19(什么时候变得这么高?)、IE、Opera 中按预期工作,但在 Chrome 或 Safari 中没有。有时它在 Chrome/Safari 中的布局是正确的,但如果你按 F5 足够多,最终其中一个渲染会意外地布局它。

这是链接http://www.spokanewastewater.org/Businesses.aspx

左侧边栏是float:left,内容都在一个 div 中display:inline-block,所有 3 个链接列表都是float:left如此,然后在“行业的角色”它<br style="clear:both" />前面有一个。然而有时 chrome/safari 喜欢将段落放在“重要链接”部分之上?这与webkit渲染有关吗?奇怪的是,它只是有时会被破坏,并且击中 f5 足以破坏它。

4

2 回答 2

2

不要使用 abr来控制clear. 将您的更改br为更合适的(div实际上):

<div style="clear: both"></div>

使用您网站上 Chrome 中的开发工具进行更改可以解决问题。

于 2013-03-12T16:01:09.303 回答
0

在当今时代使用额外的标记来清除浮动是非常过时的。有 2 种被广泛接受的技术用于清除不需要额外标记的浮动。

http://codepen.io/cimmanon/pen/qDjdr

溢出:

.parent {
    overflow: hidden;
}

微清除修复:

http://nicolasgallagher.com/micro-clearfix-hack/

.parent:before,
.parent:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.parent:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.parent {
    *zoom: 1;
}
于 2013-03-12T16:20:37.937 回答