关于位置的一些奇怪的事:FireFox中的绝对

时间:2012-02-06 05:14:32

标签: css firefox

我有这样的结构:

<div class="content">
    <div class="board"></div>
</div>

然后,这是CSS:

.content{
    height: 155px;
    left: 0;
    top: 30px;
    width: 300px;
    position:absolute;
    background-color:black;
}

.board{
    -moz-box-align: stretch;
    -moz-box-orient: horizontal;
    -moz-box-pack: center;
    display: -moz-box;
    height: 100%;
    width: 100%;
    background-color:red;
}

问题是:.board div应该与.content div完全相同。但是,.board div似乎向下移动了一下,这是jsFiddle(在FireFox中打开它!):http://jsfiddle.net/hxhxhx33/5etU5/

我认为问题出在“位置:绝对:.content div ..

如何解决?

1 个答案:

答案 0 :(得分:0)

不是position:absolute;,而是造成问题的display: -moz-box;

要进行补偿,请.board position:inherit;

http://jsfiddle.net/5etU5/1/