Page 1 of 1

css image hover

Posted: Mon Feb 07, 2011 8:49 am
by rapro
Hi guys,

I am trying to make an image hover in footer. I do understand how it suppose to work but somehow i cant get image to be shown with css. I uploaded image in right folder and tryed with .jpg and with .png but cant get it working.

css code

Code: Select all

#footer .div1 a{
	display: block;
	width: 55px;
	height: 55px;
	display: block;
	float: left;
	text-align: left;
	margin-top: 3px;
	padding-left: 1px;
	background: url('..image/ideallogobw.png');
	background-repeat: repeat-x repeat-y;
	background-position: 0 0;
}

i dont bother with hover yet becouse i cant get image to be shown.

link to my site

image of twitter and facebook in footer are called in footer.tpl, there should be one more image in front of them (ideal logo), that i am trying to call out with css.

anybody has any idias about it?

Re: css image hover

Posted: Mon Feb 07, 2011 9:32 am
by justinv
try this:

Code: Select all

#footer .div1 a{
   display: block;
   width: 46px;
   height: 41px;
   display: block;
   float: left;
   text-align: left;
   margin-top: 3px;
   padding-left: 1px;
   background: url('../../../../../image/data/ideallogobw.jpg');
   background-repeat: no-repeat;
   background-position: 0 0;
} 

Re: css image hover

Posted: Mon Feb 07, 2011 9:55 am
by rapro
thank you very much Justinv!!!!!!! solved my issue!!!

Re: css image hover

Posted: Mon Feb 07, 2011 11:12 am
by justinv
You're welcome. You could also use full paths to your images in stylesheets like this: "http://witgoedextra.nl/store/image/data/ideallogobw.jpg". This might be cleaner.

Better still, put the images related to your theme in your theme directory and the paths will be more simple.