css - 带有负文本缩进的旋转绝对定位元素使页面非常长

Question

我有一个带有背景图片的标题。我将标题的样式设置如下:

h1
{
    position:absolute;
    background:url(../somepicture.jpg) no-repeat 0 0 scroll #000;
    height:100px;
    text-indent:-9999em;
    -moz-transform:rotate(-10deg);
    -webkit-transform:rotate(-10deg);
    transform:rotate(-10deg);
    width:200px
}

http://jsfiddle.net/bw63m/

页面变得很长。我知道这是因为文本缩进与转换有关，因为我尝试删除其中一个属性并且页面变短了。

为什么当元素不旋转时宽度不扩大？这是一个 CSS 错误吗？这发生在 Chrome、Firefox、Internet Explorer 中。尚未检查 Safari 或 Opera。

谢谢。

Answer 1

使用overflow:hidden给parent position:relative不会影响整个页面