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

标签 css

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

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。

谢谢。

最佳答案

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

关于css - 带有负文本缩进的旋转绝对定位元素使页面非常长,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18268546/

相关文章:

css - IE9 多选显示问题

javascript - 如何让最后一个字母闪烁?

jquery - 如何制作 Bootstrap 版本 2 选项卡下拉列表?

javascript - Z 索引和堆叠

css - 在 flexbox 中的元素之间添加等距离的垂直线

javascript - Jquery 移动粘性 header

css - 我的原始按钮不会显示,但我的悬停会显示吗?

html - 在网页中突出显示选定的菜单项

javascript - Div 拖动不作为背景

html - 将 Bootstrap Featuretette 文本与其上方的图像对齐