IE9兼容性怪癖模式中的内联块

Question

我目前正在开发一个html / css菜单。我的问题是，加载菜单时插入的页面会导致浏览器进入怪癖和兼容模式。我无法控制这一点。

这是我的css：

.community-menu {    
    margin: 5px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 15px 30px;
    cursor: pointer;
}

#container {
    width: 100%; 
    position: relative;
    text-align: center;
}

我的问题是IE怪癖中的内联块和兼容模式会导致菜单占据其父div的全宽。

以下是Chrome和Firefox中div的含义：

在IE中，相同的div扩展到父div的全宽

我想要实现的是使用文本内容调整大小的居中div，当浏览器调整大小时会自动按下。

我在另一个SO问题中找到了一些代码，当在兼容性和怪异模式下使用IE查看时，我会发现我的问题here。

Spudley发表评论之后是一张图片，显示它加载的默认模式。

即使它说IE8，最终结果在IE9中也是如此。今天在不同的电脑上:)）

Answer 1

“display：inline-block;”更好地改变：{float：left | right;显示：内联;缩放：1; }

Answer 2

当我需要在olds和quirks IE中模拟内联块时，我只需用内联替换inline-block。 （有条件评论）