Как анимировать все элементы div блока одновременно на CSS?

Question

[mirador]

Здравствуйте. Есть такая конструкция:

<div class="row">
				<div class="iconbox design">
					<img src="images/anchor.png" height="65" width="64" alt="Anchor">
					<h3>Web Design</h3>
					<p>Fresh, lively and informative content, is key to any successful website, so take a look at your website's content on a regular basis.</p>
				</div>
				<div class="iconbox development">
					<img src="images/diamond.png" height="64" width="65" alt="diamond">
					<h3>Web Development</h3>
					<p>Fresh, lively and informative content, is key to any successful website, so take a look at your website's content on a regular basis.</p>
				</div>

Проблема в том,что я не могу задействовать :hover для всех элементов. То есть,я хочу,чтобы при наведении на весь блок одновременно менялся и тег img, и h3, и p.Отдельно каждый я менять могу,а от все вместе не знаю как.
Как я могу получить такой результат :hover?


Заранее спасибо =)

Answer 1

[Павел Беляев]

Ну дак
div.design:hover img{

}

div.design:hover h3 {

}

т.е. обозначаете в CSS пути родителя в :hover и для дочерних элементов задаете правила, если захотите менять картинки, то надо спрайт делать и сдвигать фоновое изображение, чтобы не было задержек в подгрузке картинок.

Answer 2

[Петр]

.row:hover .iconbox h3{
  // ваш стиль
}