Como la mayoría de la gente sabe,css - 100% + relleno?
a 100% div con un relleno de 5px es en realidad 100% + 10px de ancho.
Una solución obvia para esto es wrap the child div in a wrapper that has a 10px margin Sin embargo, este método requiere que agregue marcas adicionales, estoy buscando una manera de hacer 100% + relleno sin el div adicional.
¿Alguna idea?
Elementos de bloque como <div> s asumen automáticamente un ancho del 100% después del relleno. Es decir. debe poder lograr el efecto deseado simplemente especificando un relleno, dejando el ancho en auto y asegurándose de que el elemento tenga display: block (predeterminado para <div>).
Bueno, vale, mal ejemplo de nuestra parte, supongamos que no es un div, en cambio es una entrada html ... – Hailwood
@Hailwood Es un detalle bastante importante para omitir. :-P En ese caso, no tiene más remedio que usar un contenedor (si le importa el IE). – deceze
Sí ... Lo malo: D – Hailwood
Usted debe mirar en la propiedad CSS box-sizing ...
que arme un ejemplo para mostrar cómo funciona esto y la diferencia entre tener la propiedad box-sizing y no tenerla. Echa un vistazo al violín ...
http://jsfiddle.net/UnsungHero97/bKsad/2/
Tenga en cuenta que esto no funcionará en IE7 o por debajo:/
espero que esto ayude.
Hristo
si utiliza 'padding-left' y' padding-top' y 'padding-bottom'? este es el resultado que quieres? o puede ver en http://stackoverflow.com/questions/5219175/width-100-padding – jotapdiez