[kepin]

Hi everyone,


I need some help on CSS in the header part of my client Pligg+ site. The one that should link to the homepage ( <a href ="/"><h1> </h1> </a> ). The picture is not showing up on the page.

Here is the site : www.flogz.com

Here is the CSS

PHP Code:

#header h1 {
    font-size: 100%;
    margin: 0;
}

#header h1 a, #header h1 span {
    display: block;
    height: 45px;
    width: 165px;
    background: url("/images/spacer.gif") bottom left no-repeat;
    text-indent: -2000em;
    position: absolute;
    top: 0;
    /*left: 0;*/
    text-decoration: none; border:0; 
    z-index: 1000; /* need for FX and IE */
}

#home h1 a {
        background: url("/images/spacer.gif") top no-repeat; border:0; }
        
/* only for IE */ * html #header h1 a, * html #header h1 span { bottom: -1px; }

#header h1 span { background: url("/images/spacer.gif") top no-repeat; } 


Thanks in advance !!

[cryptkeeper]

beautiful site. I cannot see your problem, sorry, mabey you fixed it?

[kepin]

Thanks cryptkeeper. No, I haven't fixed it yet. The logo on header is showing up but there is no "hyperlink". If you move your mouse cursor to the very TOP LEFT, there is a graphcic "spacer.gif" that hyperlink to the homepage, but it's always on the TOP LEFT. The "spacer.gif" should be ABOVE the "Flogz" logo. Is that make sense?

Thanks anyway !

[cryptkeeper]

I see what you mean, the hyperlink stops at G.

have you tried changing the graphic to a solid color (just for testing, so you can see it) then changing the position to relative and try moving it around? my css is very limited i havent used much since starting to use pligg.

[cryptkeeper]

hey, i went to your site via the ",y site" forum, and the site poped up in a new window, I think I realised the problem.

resize your internet explorer so that is is the same width as your header. you see it's in place? now maximise your window, the invisible spacer is ANCHORED to the top left of the screen, this is because you are using "position: absolute;" either change it to "position: relative;" or remove it. if you change it to relative you might need to move it around a bit.

my CSS isnt too good, but i belive absolute means that the object is judged by the screen (IE size) where relative is relative to the position of the div.

[kepin]

it works cryptkeeper ! Thanks man !