html - How to make entire group change color on hover? -
if go http://cascade2.hostei.com/collection.html
and hover on picture of chandelier, notice entire group turns grey blue. if hover on caption below it, notice caption turns blue.
how can change when hover on caption, turn border of picture blue? preferably in html or css.
ignore shadow , of other errors. html:
<center> <figure class=cheese> <a class=cheese href="images/cascadelucecatalog.pdf"> <center><img src="images/cataloguefront.jpg" width="400" height="398" alt=""/> </center><figcaption> <h2><p>2013 cascade luce catalog</p></h2></figcaption></a> </figure></center>
css:
.cheese { background-color: #4d4d4d; -webkit-box-shadow: 1px 1px 15px #999999; box-shadow: 1px 1px 15px #999999; color: #fff; } .cheese p{ color: #fff; } .cheese:hover, .cheese:active, .cheese:focus, .cheese :hover, .cheese :active, .cheese :focus{ text-decoration: none; background-color: #43a6cb; }
you need target img when .cheese hovered.
.cheese:hover img { background-color: #43a6cb; }
Comments
Post a Comment