Right I need a bit of help with css image replacement, I'm trying to replace a <h1> tag with an image/logo.
This is for the homepage of a wordpress install, all other pages use the page/post title as <h1> and show the image/logo. The homepage has no <h1> tag and I'd like to make use of this and show the logo, but replace the text for the logo if that makes sense.
Please ignore the fact that we need to run at least two different wordpress headers to do this, that's fine and all sorted.
This is the code in the homepage header that I'm putting the <h1> tag in:<div id="header">
<div class="headerlefthome">
<h1><a href="http : //mysite . com" title="my homepage">My Keywords</a></h1>
</di.....
And this is the code I've come up with for the stylesheet:.headerlefthome {
background-image:url(images/disclogo.jpg);
background-repeat:no-repeat;
width: 440px;
height: 105px;
float: left;
margin: 0px;
padding: 0px 0px 0px 0px;
}
.headerlefthome h1{
display: none;
}
So far this work's fine and dandy, it display's the logo and still keeps the <h1> tag in the source code.
The problem is the image isn't a clickable link like all other pages of the site. I know it doesn't really matter as it's the homepage but I like everything uniform and I'm sure I'm going about this all the wrong way.
Does anyone have a better solution to my little hotch potch?