How do i fix my header?? - Please help....Thanks!

Hi....

I just added a logo to my header...however i cant seem to get rid of text that lies above logo....any help??

see http://www.linkedkeywords.com

thanks
tony

 

Put the image in the foreground, and make the text the alt value.

<h1>
  <a href="http://www.linkedkeywords.com">
    <img src="http://www.linkedkeywords.com/images/book_open_logo.gif"
         alt="LinkedKeywords.com" /></a>
</h1>
==========
a img {
  border: none;
  }

Code (markup):

cheers,

gary

 

Or, if you want to get fancy, you could have the anchor hold a "background" image which is absolutley positioned over the header and cover real text... the only advantage to this over Gary's is that for some dumb reason there are screen readers who apparently don't always read ALT text... why, I dunno, since alt text was practically MADE for them anyway... bleh

<h1>LinkedKeywords.com<a href="http://www.linkedkeywords.com"></a></h1> [b]<--edit, I moved the words from inside the link to only inside the h1[/b]
==========
h1 {
  set a height
  set a width <-- both equal to the h and w of the image;
  position: relative;
  whatever else...
}
h1 a {
  position: absolute; <--this also makes it a block so we can set dimensions
  height: same as above or 100%;
  width: same as above or 100%;
  top: 0;
  left: 0;
  background: url(images/book_open_logo.gif) 0 0 no-repeat;
  border: 0;
  set text colours etc here for text styling when those without images are surfing
}

Code (markup):

Or something like that. It's a bit more dicking around but unless the image has transparency it's quite nice.

 

Gary....see site now...what did i do wrong?...it shows double headers....

tony

 

Uh oh, you DO have a semi-transparent image. So, you MUST use Gary's solution and not mine. You have two images because first you have the HTML img (keep this)
<img src="blah... />

AND in your CSS you have the image as a background to the a:
#header h1 a:link, #header h1 a:visited {
color:#0063DC;
padding-left:64px;
background:url(../images/book_open_logo.gif) no-repeat left center;<---remove this
}

 

awesome!!...you guys are great!!...thanks!!

tony