html - 如何设置框宽度与屏幕宽度相同？

Question

现在我正在使用 HTML,CSS 编写移动页面代码。我想设置一个框，它有一个更漂亮的背景颜色和一些文本来显示信息。但是当我设置宽度为100%时，框的宽度与屏幕的宽度不一样。这不是我想要的。我如何在 css 中解决它？

我试过“width:100%”，但失败了。我的 CSS 是:

div
{
    position: absolute;
    top: 105px;
    left: 0;
    height: 47px;
    width: 100%;
    line-height: 47px;
    background-color: rgba(255,108,108,0.5);
}

HTML 是:

<div><span>my number:<span><span>517014910</span></div>

Answer 1

参见 fiddle here

使用宽度:100%

div{position: absolute;top: 105px;left: 0;height: 47px;width: 100%;line-height: 47px;background-color: rgba(255,108,108,0.5);}