tags:

views:

24

answers:

2

can you force an element, that is inside a continer, to extend beyond that container?

i.e.

container{
width:985px;
margin:0 auto;
}

footer{ 
i need to force this outside of the container
}

hope that makes sense.

+1  A: 

overflow:visible;

Jiert
+1  A: 

CSS:

.container{
    width:985px;
    margin:0 auto;
    position:relative;
    padding-bottom:130px; /* height of footer + 30px (your own) */
    background:yellow;
}

.footer{ 
    position:absolute;
    left:-25px; /* (1045 - 985) / 2 */
    bottom:0; /* stick to bottom */
    width:1045px; height:100px;
    background:#CCCCCC;
}

HTML:

<div class="container">
    Container Area
    <div class="footer">
        Footer Area
    </div>
</div>

Preview:

alt text

Jeaffrey Gilbert