如何设置元素以填充页面宽度，而不管包含元素的样式？

Question

即使包含元素有边距/填充和相对定位，我如何设置元素的样式以填充页面（或正文）宽度？

换句话说，in this fiddle，在不更改容器或子容器的情况下，如何设置我的蓝色内容div的样式，使其文本填充页面宽度？

我觉得position: absolute很近，但没有雪茄：我希望相对于整个页面（或正文）宽度定位，而不是相对于父元素。有什么想法吗？

Answer 1

我不认为你想用纯CSS做什么。 （至少使用您当前的HTML结构）

但是，我提出了这个jQuery解决方案：

$(window).resize(function(){
    setContentWidth();
});


function setContentWidth()
{
    var windowWidth = $(window).width();
    var leftOffset = $('.container')[0].offsetLeft;

    $('.content').css({'width': windowWidth, 'left': -leftOffset});
}

setContentWidth();

<强>样本：

http://jsfiddle.net/fg9T4/16/