IE7 does not understand display: inline-block(IE7不理解显示:inline-block)
问题描述
有人可以帮我解决这个错误吗?使用 Firefox 可以正常工作,但使用 Internet Explorer 7 就不行了.display:inline-block;
.
Can someone please help me get my head around this bug? With Firefox its working fine but with Internet Explorer 7 its not. It seems not to understand the display: inline-block;
.
html:
<div class="frame-header">
<h2>...</h2>
</div>
css:
.frame-header {
height:25px;
display:inline-block;
}
推荐答案
IE7 display: inline-block;
hack如下:
The IE7 display: inline-block;
hack is as follows:
display: inline-block;
*display: inline;
zoom: 1;
默认情况下,IE7 只支持自然 inline
元素上的 inline-block
(Quirksmode 兼容性表),所以你只需要这个 hack 来处理其他元素.
By default, IE7 only supports inline-block
on naturally inline
elements (Quirksmode Compatibility Table), so you only need this hack for other elements.
zoom: 1
是用来触发 hasLayout
行为,我们使用 star 属性 hack 将 display
设置为 inline
仅在 IE7 及更低版本中(较新的浏览器不适用).hasLayout
和 inline
一起基本会触发 IE7 中的 inline-block
行为,所以我们很高兴.
zoom: 1
is there to trigger hasLayout
behaviour, and we use the star property hack for setting the display
to inline
only in IE7 and lower (newer browsers won't apply that). hasLayout
and inline
together will basically trigger inline-block
behaviour in IE7, so we are happy.
此 CSS 不会验证,并且无论如何都会使您的样式表混乱,因此通过 条件注释使用仅限 IE7 的样式表 可能是个好主意.
This CSS will not validate, and can make your stylesheet messed up anyways, so using an IE7-only stylesheet through conditional comments could be a good idea.
<!–-[if IE 7]>
<link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]–->
这篇关于IE7不理解显示:inline-block的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:IE7不理解显示:inline-block
基础教程推荐
- 在 JS 中获取客户端时区(不是 GMT 偏移量) 2022-01-01
- 在for循环中使用setTimeout 2022-01-01
- 有没有办法使用OpenLayers更改OpenStreetMap中某些要素 2022-09-06
- 角度Apollo设置WatchQuery结果为可用变量 2022-01-01
- 悬停时滑动输入并停留几秒钟 2022-01-01
- 响应更改 div 大小保持纵横比 2022-01-01
- 当用户滚动离开时如何暂停 youtube 嵌入 2022-01-01
- Karma-Jasmine:如何正确监视 Modal? 2022-01-01
- 动态更新多个选择框 2022-01-01
- 我什么时候应该在导入时使用方括号 2022-01-01