How to re-position logo to overlap content area?

  • Hello folks!

    I cannot figure out how to make our logo slightly overlap our content area below it on this page (rough draft stage still)

    https://harddrivemarine.com/DRAFT/

    I’d like the logo in the top left to overlap into the image below. I was able to make the logo sit “lower” with this CSS – – – but then that caused everything below to also shift down — not what I was after.

    #logo {
    margin-top: 50px;
}

    How can I keep the logo on “top” and have ONLY the logo move and have it overlap the image slightly? Hope this is making sense….

    Thank you!!

Viewing 2 replies - 1 through 2 (of 2 total)

  • I’m not sure if this is the best way to get the desired result, but you can add some CSS for #logo like:

    position: absolute;
    top: 25px;(not margin-top)
    z-index: 1000;

    again, not sure if this is the best way, but I tried it out in an editor and got the logo to drop a little below the image.

    Try it out and see if it works for you

    Thread Starter yukon4

    (@yukon4)

    You are a GENIUS!!! That did the trick.

    https://harddrivemarine.com/DRAFT/

    Now I see that we need to make a few changes to the logo itself so it looks a little nicer when overlapping the homepage image as it now does.

    Thank you, thank you, thank you for your help! Much appreciated.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to re-position logo to overlap content area?’ is closed to new replies.