Safari中的转换被窃听

Question

我发现了一个奇怪的错误。 我需要在一个盒子上做一个过渡宽度/高度，我需要这个盒子是绝对的和内联块。 这适用于除safari之外的所有浏览器。

这是一个例子：http://jsfiddle.net/575FE/

HTML：

<div id="block">
SOME TEXT
</div>

CSS：

#block {
    height: 200px;
    width: 200px;
    background-color: yellow;
    -moz-transition: 0.6s all;
    -webkit-transition: 0.6s all;
    -o-transition: 0.6s all;
    transition: 0.6s all;
    display: inline-block;
}

#block:hover {
    height: 400px;
    width: 400px;
    background-color: blue;
    position: absolute;
}

inline-block + absolute的组合使得转换在safari中不起作用。 谁知道怎么修它 ？ 感谢。

Answer 1

从#block:hover

移除位置：绝对

<强> Updated DEMO

#block:hover {
    height: 400px;
    width: 400px;
    background-color: blue;
}