Highslide issue
-
I have the Highslide plugin running, but my question is regarding the shadow. I made this change to my stylesheet for my theme (iTheme)
.img-shadow {
clear: both;
float: left;
background:url(images/shadow.gif) no-repeat bottom right; margin:
}
.img-shadow img {
display: block;
position: relative;
border: 1px solid #a9a9a9;
margin: -2px 2px 2px -2px;
padding: 4px;
background: #000;
}I created a shadow.gif and put it in the /images folder. But my thumbnails aren’t showing the shadow effect. Isn’t this what it’s supposed to do, combind my thumbnail + the shadow.gif i created to make it look like the image has a drop shadow?
Also, my thumbnails all have a box around them that disappears when I mouse over, any one know how I can disable that?
-
I edited the highslide.css and took out the border: 0px solid gray; from the .highslide img part, now the border is gone, but when I mouse over the image the image moves and the whole screen shifts (hard to explain) any ideas?
Instead of giving negative margins, why dont you give the .img-shadow a right and bottom padding and set its background image.
Something of this sort –
.img-shadow { clear:both; float:left; background:url(images/shadow.gif) no-repeat bottom right; padding-right:4px; /* Assuming shadow takes 4px */ padding-bottom:4px; border: 1px solid #a9a9a9; }.img-shadow img { display: block; padding:4px; }I’m assuming that the div tag contains only the img tag. Other tags (and especially text) may mess this up.
ok thanks I will try that, my CSS is limited, I was using the code directly from the author thinking it should be good. But I’ll try yours and if that doesn’t work I’ll research and find out what I need to do to accomplish it, thanks again man
The topic ‘Highslide issue’ is closed to new replies.