Grow your CSS skills. Land your dream job.

positioning “header” outside the “wrapper” div

  • # March 7, 2012 at 9:34 pm

    I would like the header image to jut outside the brown “wrapper” div it’s contained in.
    I am using Genesis Framework. I supposed I create another div, but want to see if I can do this using CSS. Here is the CSS I am using. I tried using a position attribute, but none were working.

    #wrap {
    background-color: #aa6d24;
    margin: 75px auto;
    width: 960px;
    padding: 0;

    #header {
    margin-top: -25px;
    margin: auto;
    height: 198px;
    width: 100%;
    background: url(images/head.png);


    # March 7, 2012 at 11:02 pm
    #wrap {
    margin:75px auto;
    padding:0px 0px;
    position:relative; /* add relative position */

    #header {
    background:transparent url(images/head.png) no-repeat;
    top:-208px; /* height + 10 */
    # March 7, 2012 at 11:28 pm

    Thank You :)

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".