[Solved] CSS Hover Selector | Shawdow Box issues | CSS, HTML

[kevmacs]

Hi everyone,

I am using this template:
http://www.free-css.com/free-css-templates/page186/brushed

I added an “ADD TO CART” button but I can’t click on it because the red hover box is encompassing the image and the Add to cart button.
I want to keep the red hover over the image only and leave the add to cart button accessible to be clicked.

EXAMPLE:
http://streaminustv.com/Example/Template/brushed/example.html

I’m missing something. ANY HELP would be greatly appreciated ;)

Thanks,
Kevin

[Atelierbram]

Would it be an option to exclude this module from the Isotope image gallery? Or maybe try to make the nesting of elements different, for right now everything is inside this list-item, and all is position: absolute. Some errors in the javascript as well.

[kevmacs]

I don’t really understand your answer as I only 1/4 understand code :)

I would be happy to find any solutions that keep the images in their respective groups and still allow users to:

1) click image to enter shadow box mode
2) click on add to to cart

I just don’t know how to change the code.

[kevmacs]

I figured it out:

item-thumbs .hover-wrap {
position: absolute;
display: block;
width: 100%;
height: 100%;

Just changed the Height: to 60% and that tells it to leave 40% of the box to NOT be “linked” to the image.

[Author]

Posts