Support » Fixing WordPress » How to absolutely position a logo outside the content area

Viewing 6 replies - 1 through 6 (of 6 total)
  • anyone? 🙁

    Give us a chance here, you have asked a complex question

    ok, thanks mechx1 😀

    You can’t tilt an image in HTML (it would be great if you could). So, you will need to create your logo positioned in a rectangular image with a transparent background, then save as a PNG so you can have a transparent background. This can be absolutely positioned on the page over the background image, but you may need to have a fixed height declared on the containing DIV to take care of the way older versions of IE handle absolute positioning. You will need to assign z-index to the logo and the DIV containing the background so the logo floats over the background.
    Note: IE6 does not support alpha transparency natively, so if your audience includes that browser, you neeed a filter from the Microsoft site.

    I understand the theory, but its practically, how do i implement this?
    Im a bit rubbish at css, but i have an ok understanding of it. Could you give me either some code or instructions of how to implement this?

    Actually i think i have solved it….

    I put this in the CSS:

    #logo, #logo a { display: block; height: 150px; width: 325px; }
    #logo { position: absolute; top: 0px; left: 0px; }
    #logo a { background: transparent url(images/logo.png) top left no-repeat; text-indent: -9999em; }

    and implemented it through the header.php:

    <div id="logo">
    <div class="logo a">
    <a href=""></a></div>

    Its seems to be working.

    Only problem is that is i shrink the window, the logo moves with the window, not the content. Anyone know how i can fix the logo to the content, while maintaining the positioning?

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘How to absolutely position a logo outside the content area’ is closed to new replies.