Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

css help - I need to move header image down from top of the page

Options
  • 27-09-2010 10:56pm
    #1
    Registered Users Posts: 168 ✭✭


    Hello again :D

    I got some great help here last week with a css issue. http://www.boards.ie/vbulletin/showthread.php?t=2056040456 But now I'm back again in need of a little guidance.
    The website in question is : http://www.monorail.ie

    I need to push the header.png image down from the top of the page, so that I have a view of the background wood-panel at the top of my site. Once I have this figured out in the code I will then reconnect my header and wrapper images again, and generally clean up this area.

    I have pasted code from my template.css file and I'm pretty sure the change/extra code must be added to the header section. Can anyone help me with this please?


    /*****************************************/
    /*** Template specific layout elements ***/
    /*****************************************/
    #page_bg {
    padding: 0;
    background: url(../images/bodybg.jpg) top left repeat;
    /* background: url(../images/monorail_image.jpg) top left repeat; */
    /* this image is now the wood panel background */
    }

    div.center {
    text-align: center;
    margin: 0 auto;
    padding: 0;
    width: 954px;
    }

    div#wrapper {
    margin: 0 auto;
    width: 954px;
    text-align: left;
    /* background: url(../images/content.jpg) top center repeat-y; */
    background: url(../images/monorail_image.png) top center repeat-y;
    /* this imiage is the original monorail black and white photo */
    }

    #header {
    height: 300px;
    /* this is the distant between the top of the screen and the black/white image */
    /* background: url(../images/header.jpg) top center no-repeat; */
    margin: 0 auto;
    width: 954px;
    text-align: left;
    background: url(../images/header1.png) top center no-repeat;
    /* this my new header image that was stripped from the top of our main picture */
    }

    #content {
    height:1100px;
    /* this height figure is to keep the full monorail poster without the wrapper resizing itself */
    width: 900px;
    margin: 0 auto;
    padding: 0 42px 14px 14px;
    overflow: hidden;
    }


Comments

  • Closed Accounts Posts: 18,163 ✭✭✭✭Liam Byrne


    Setting margin-top of #header should do the trick for you


  • Registered Users Posts: 168 ✭✭the_god_swan


    Liam Byrne wrote: »
    Setting margin-top of #header should do the trick for you

    Success ;) Cheers lad.


Advertisement