100% Screen width on div nested in fixed width div css

Question

I'm trying to get a nested div to be full width on screen out of the div that it's contained/nested in.

http://jsfiddle.net/TheeAndre/JAdps/

<div class="fixedwidth">
    <div class="fullwidth"></div>
</div>

Answer 1

Try

width:100vw;  

instead of

width:100%;  

Check for compatibility issues: http://caniuse.com/#search=vw

Pascalz, yes in your jsfiddle it works, but only as long as you don't specify a position other than static for your parent. In many cases you need your parent to be position:relative, so the child will relate width:100% to parent width.

Answer 2

try this :

.fullwidth {
    background-color:#000; 
    width:100%; 
    height:100px; 
    position:absolute; 
    z-index:999;
    left: 0;
    right: 0;
}