Firefox和Chrome上的margin-top

Loh*_*don 4 css browser margin

我的网站上有一个侧面导航栏.侧边栏与您一起滑动并更改margin-top.在谷歌浏览器上,它跟随你,而在Firefox中,它使所有框跟随你,这不会让你向下滚动页面. http://jsfiddle.net/rDV3T/这是一个例子.

<span class="hi">HI</span>
<span class="hello">Hello</span>
Run Code Online (Sandbox Code Playgroud)

CSS

.hi {
    margin-top: 10px;
    background-color: red;
    display: inline-table;
}
.hello {
    display: inline-table;
}
Run Code Online (Sandbox Code Playgroud)

如果你在firefox上测试,所有的框都会下降10 px,而在chrome中只有指定的框(hi)会下降.我怎么能解决这个问题?谢谢你,对不起我的英语和解释.

Ber*_*lue 10

如果您添加vertical-align: top;到您的hello类,该示例在所有浏览器上看起来都是相同的.

.hello {
    display: inline-table;
    vertical-align: top;
}
Run Code Online (Sandbox Code Playgroud)