Как фоновое изображение дочерних объектов...

[DDSSDD]

Есть такая конструкция

<a href="1.html">
           <div id="left">
                <div class="csbox4">
                  <div class="cssbox_head_3 h2_3">
                    <h2 ></h2>
                  </div>
                  <div class="cssbox_body_3">
                      <p> </p>
                      <p></p>
                 </div>
                </div>
              </div>
</a>

CSS

#left {
    position:absolute;
	top: 0px;
	left: 4px;
    margin:0;
	padding:0;
	width: 250px;
	float:left;
	z-index:4;
	}

.cssbox_body_3, .cssbox_head_3,.cssbox_head_3 h2, .csbox_3, .csbox4 { 
	background:url(images/Box_center.png) no-repeat bottom right;
	} 
.csbox4, { 
    width: 250px; 
    width: 250px; 
    padding-right: 11px; 
    margin: 1px auto; 
} 
.cssbox_head_3 {
	background-position: top right; 
	margin-right: -11px; 
	padding-right: 40px; 
	text-decoration: none;
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	color: #E7C374;
	font-size: 16px;
	}
 .cssbox_head_3 h2{
	background-position: top left;
	margin: 0;
	border: 0; 
	padding: 30px 0 0px 40px;
	height: 1%; 

}  
.cssbox_body_3 {
	background-position: bottom left;
	margin-right: 25px; 
	padding: 1px 0 15px 30px;
	text-align: justify;
	font-size: 13px;
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

Представляет собой масштабируемый бокс с фоновым изображением.
Фоновое изображение одно для всех дивов, но в каждом из них имеет свое позиционирование.
Задача: при наведении мыши на бокс должно меняться фоновое изображение во всех дивах, сохраняя позиционирование.
Через :hover фон меняется, но в каждом диве.
Нужно именно, что бы фон менялся сразу во всех элементах конструкции при наведении на любой див, при этом сохраняя позиционирование background для каждого объекта отдельно.

[poorking]

В чем проблема? Просто задаете background-image отдельным свойством а не в общем свойстве background, затем по hover На родителе меняете во всех дивах background-image, никакого js не надо, вот пример, но я меняю цвет фона, просто суть

<style>
	.p{
		padding: 20px;
		border: 1px solid red;
	}
	.p:hover .c1, .p:hover .c2{
		background-color: red;
	}
	.c{
                background-color:green;
		padding:20px;
		margin-bottom: 10px;
	}
</style>
<div class = "p">
	<div class = "c c1"></div>
	<div class = "c c2"></div>

</div>

И нельзя внутрь строковых элементов вкладывать блоки

[DDSSDD]

Спасибо. Направили на правильную мысль.
Все получилось. Только позиционирование фона каждого из дива отдельно
пришлось прописывать для :hover.

А как тогда сделать ссылку из блока на другую страницу, без строчных элементов, не в CSS же url писать?

[poorking]

Честно не знаю. Первое что приходит в голову, используйте событие онклик и js, но это усложнение. Можно вместо блоков использовать спаны А вообще наверно и по вашему можно, просто валидатор будет материться. Если вам валидность важна то выкручивайтесь. Я не очень понимаю зачем она, многие крупные известные ресурсы не валидно сверстаны. Проверьте лицокнигу, контакт. Море ошибок.

[DDSSDD]

Тут еще столкнулся с одной проблемой, что то туго соображаю... не могу понять как удобней, а главное кратко написать CSS:
Та же ситуация, что описана мной выше, где блоку с ID left присваивается background по событию :hover и затем этот фон присваивается всем дочерним объектам блока left с определенным позиционированием.
Только вот блоков у меня 5 и выше одинаковых, но с разными ID. Фон у них должен меняться так же как и блока left.
Как кратко написать CSS, пример:

#left:hover .csbox4, #left:hover .cssbox_head_3, #left:hover .cssbox_head_3 h2, #left:hover .cssbox_body_3 { background:url(images/Box_center_blu4.png) no-repeat bottom right;
    }

Как коротко дописать #right, #top и др.
Так же нужно учесть, что вложенные в них блоки типа:

.cssbox_head_3....
.cssbox_body_3

имеют другие названия.
Не писать же для каждого блока отдельно CSS для background и позиционирования.