Foros del Web - Ver Mensaje Individual - Aplicar estilo de un div haciendo hover en otro

kseso? · #8 (**permalink**) 09/12/2011, 15:24

Como curiosidad (plenamente funcional*) sí se puede lograr con css el cambiar una propiedades de una caja al hover sobre otra hermana, incluido el primero al hacer hover sobre el segundo.

Código HTML:

Ver original<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>Kseso? jugando con css</title>
<style type="text/css">
* {
  margin:0; padding:0; position: relative;
}
#container {
  width: 600px;
  height: 400px;
  margin: 0 auto;
}
#izquierda, #derecha {
  width:50%;
  height: 100%;
  float: left;
}
#izquierda {
  background: red;
}
#derecha {
  background: blue;
}
#container:hover #izquierda {background: green;}
#izquierda:hover {background: red!important;}
#izquierda:hover ~ div {background: green;}
</style>    
</head>
<body>
<div id="container">
    <div id="izquierda">Caja Izquierda</div>
    <div id="derecha">Caja derecha</div>
</div>
</body>
</html>

No, no es que estén operativos selectores de precursores en el dom. Sólo es una declaración para que lo aparente.

* plenamente funcional= a estas alturas, quien use ie6, ¡allá penitas!