IE 的 CSS 显示内联块问题

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4750088/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 23:30:35  来源:igfitidea点击:

CSS Display inline-block issue with IE

cssinternet-explorerinlineblock

提问by Evan

I've faced with an issue with IE6 & IE7 issue and I was hoping someone had a solution for me other than to not use IE6/7. The cost on the right needs to be on the same line as the label on the left. I'm only able to get to this to work in FireFox, but in IE7, for example, it places cost on the line below even though I'm using inline-block. An yhelp would be greatly appreciated

我遇到了 IE6 和 IE7 问题,我希望除了不使用 IE6/7 之外,有人为我提供解决方案。右侧的成本需要与左侧的标签在同一行。我只能在 FireFox 中使用它,但是在 IE7 中,例如,即使我使用的是内联块,它也会在下面的行中增加成本。任何帮助将不胜感激

Note: I turned on borders so I could see what's happening...

注意:我打开了边框,所以我可以看到发生了什么......

Demo of my issue: http://jsbin.com/ilese4/

我的问题演示:http: //jsbin.com/ilese4/

Here's a picture of how it renders in IE7.

这是它如何在 IE7 中呈现的图片。

alt text

alt text

回答by bluish

This link can help to solve it: Cross-Browser Inline-Block

这个链接可以帮助解决它: Cross-Browser Inline-Block

The very least you need to make inline-blockwork cross-browser (incl IE6/7) is:

使inline-block跨浏览器(包括 IE6/7)工作所需的最起码是:

.my-inline-block {
    display: inline-block;
    *zoom: 1;
    *display: inline;
}

You may need to fix additional quirks; details and explanations are in the link...

您可能需要修复其他怪癖;详细信息和解释在链接中......