Capy

Como evitar que los input excedan el tamaño del div que los contiene

Siempre trato de ser practico y dar pocas explicaciones del porque llegamos a donde llegamos, así que si quieren saber porque falla pueden leer esto.

Para lograr que un input pase de esto:

A esto:

Al input que les está dando problemas pónganle los el siguiente selector:

.elemento{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.elemento{

-moz-box-sizing: border-box;

-webkit-box-sizing: border-box;

box-sizing: border-box;

}

Básicamente va a sumar los padding y bordes que tenga aplicado el “elemento” a lo que el navegador considera un width del 100%.

NOTA: en ie7 no funciona para nada esta solución pero tranquilos que otro día pongo alguna solución para él.