-
Looking for a hover effect for this image styling
I'm using this CSS to dress up my images in a gallery. What i'd like to do is create a hover effect for the thumbnails so the background-color changes to something slightly darker, for example.
Here's the code I have:
.imageBorder {
padding:7px;
background-color:#F5F4F2;
border:1px solid #c8c8c7;
margin: 5px;
text-decoration: none;
}
I'm also using this to remove any 'link' borders:
a img {border:none;}
The images are wrapped in a div with the class being the style above like so:
<a href="pagename.htm"><div class="imageBorder"><img src="nameofimage.jpg"></div></a>
I've experimented with all kinds of ideas but can't get it to change the background-color on hover. Help? Ideas? Thanks in advance!
-
-
#imageborder a:hover img {
padding:500px;
background-color:#FF0000;
}
this will make a 500px background in red around your image.
dont know if i named your div right but you can change that name and the color and sizing but that should be it
and move the imagborder on the outside of the a tag so the a is within the right div.
-
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
Bookmarks