旋转设备溢出-x - ：在/之后

Question

我对此代码有疑问：http://jsfiddle.net/ftm9o335/1/ 当我旋转设备时，似乎身体上的溢出-x不起作用。

我认为问题在于此规则.banner-strip:before, .banner-strip:after {width: 9999px;}

所以我认为这段代码效果不好。

如何显示宽度为100％的元素，该元素位于另一个元素内的元素之前和之后。 我必须使用jQuery？

我认为用jsfiddle示例一切都很清楚，很难解释。

Answer 1

如果您将.banner-strip放在left:0;上，而在其上有padding: 5px 50px;，则可以删除伪元素并获得相同的结果。您还需要对border-box进行大小调整，以在宽度中包含填充。

.banner-strip {
    width: 100%;
    padding: 5px 50px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    position: absolute;
    left: 0;
    bottom: 50px;
}

这假设伪元素除了＆＃34;扩展＆＃34;之外没有其他用途。左/右侧的标题。