Thumbnail hover in FF and chrome

[afuent]

I have been meaning to ask this for some time and have never been able to dig up an answer in the forums. My thumbnail hover works in IE but no other browser. Can I alter the code so it will display properly in FF and Google Chrome?
Much appreciated - Andrew
http://www.pbase.com/afuent

[mardoli]

Hello, Andrew!
Maybe you can try this

Code: Select all

a.thumbnail, a.thumbnail:link,
a.thumbnail:visited, a.thumbnail:active
{
border: rgb(40, 40, 40) 2px solid;
margin-bottom: -55px;
padding-top: 10px;
width: 172px;
height: 200px;
display: block;
background: rgb(35, 35, 35);
}
a.thumbnail:hover
{
  border: rgb(255, 0, 0) 2px solid;
margin-bottom: -55px;
padding-top: 10px;
width: 172px;
height: 200px;
display: block;
background: rgb(69, 69, 69);
}

I hope it can help.
Best Marisa

[afuent]

Marisa,
Thank you so much. I think I am almost there. When I apply the changes and view them in Chrome (not sure if this is the problem) I loose the horizontal spacing and the bottom border. I have applied the updates to this page http://www.pbase.com/afuent/black_desert
Further guidance would be greatly appreciated.
Regards,
Andrew

[mardoli]

Good Morning, Andrew!
I have not Chrome, but I think the problem you experienced is the same in Firefox.
I think there is an easy way to solve it; you have simply to increase the space between your thumbnails.
To do that, please go to the edit page of your gallery, you’ll see you have the option for changing cell spacing and cell padding, augment the number of pixels there until the bottom border is visible again.
I have tried in one of my galleries testing your CSS and it works for me in Firefox.
Let me know if your problem is solved.
Have a nice day
Marisa