Focus con css

[Alexis88]

Siento tener que desmentir lo dicho por DrFaust, pues sí hay forma de trabajar con el enfoque en una caja de texto u otro elemento focusable. Para esto existe el selector :focus.

Código CSS:

#miInput:focus{
  width: 20em;
}
 
#miInput:focus ~ #miDiv{
  width: 20em;
  height: 10em;
  background: linear-gradient(black, white);
}
 

De este modo, cuando la caja de id "miInput" tenga el enfoque, crecerá hasta 20em su ancho y el Div de id "miDiv", el mismo ancho indicado para la caja, además de una altura de 10em y un color de fondo degradado.

Así es como se ve: http://jsbin.com/eFeneCep/1

Saludos