input tamano dinamico

[phyronx]

Buenas, tengo un input el cual al pulsarlo, focus, se alarga, pero al desseleccionarlo vuelve al tama;o original, y eso es lo que no quirero.

El codigo css:

Código CSS:

<style>
 
input.srch{
    -webkit-transition: width 1s ease;  
    -moz-transition: width 1s ease;  
    -o-transition: width 1s ease;  
    -ms-transition: width 1s ease;  
    transition: width 1s ease;  
}  
  
input.srch:focus {  
    width: 280px;  
} 
 
    
      
</style>
 

[pzin]

Es que focus es precisamente sólo para cuando el foco esté en el elemento.

Tendrías que usar alguna solución vía javascript, aunque sólo sea añadir una clase al elemento mediante javascript y luego definirla en tu CSS de forma normal y corriente —yo haría esto para luego seguir aprovechando las transiciones de CSS.