I have a wordpress blog and would like to make the header image clickable so when clicked on the image it will take me back to the home page. The only place where I can find the header image is in the css and I'm not sure how to make it clickable. Here is the code from the .css file. #pic { width: 770px; height: 200px; border-bottom: 2px solid #222; clear: both; float: left; } #picd { background: url('images/banner.jpg') no-repeat; width: 770px; height: 200px; border-bottom: 2px solid #222; clear: both; float: left; } .blog #pic { background: url('images/banner.jpg') no-repeat; } .404_error #pic { background: url('images/banner.jpg') no-repeat; border: 1px solid #ff0000; } .archive #pic { background: url('images/banner.jpg') no-repeat; } .about #pic { background: url('images/banner.jpg') no-repeat; } Code (markup):
You could wrap it with an <a> set it display as block ( display:block ) and pointing to your home. or you could place <a><span>home</span></a> and set as block, set the dimension to match your desired size ( i.e like the size of the image ), then positioned it. after that for use diplay:none for the span.
you can't make something clickable from css. This needs to be done either through HTML or Javascript. You should probably read some HTML tutorials
and if you decide on .js instead of using an anchor tag, you're a **** retard. Though really we're all taking wild guesses since CSS without the HTML it's being applied to is gibberish. Of course if it's a heading, one has to ask why it's not in a heading tag and what the **** you need an ID for... much less that from a CSS standpoint it almost looks like you are using the same ID more than once in the markup; that or you have an assload of redundant/unnecessary code.