¿Cómo evito que la propiedad padding cambie el ancho o el alto en CSS?

Estoy creando un sitio con DIVs. Todo funciona excepto cuando creo un DIV. Los creo así (ejemplo):

newdiv {
    width: 200px;
    height: 60px;
    padding-left: 20px;
    text-align: left;
}

Cuando agrego la padding-leftpropiedad, el ancho de los DIVcambios a 220 px y quiero que permanezca en 200 px.

Digamos que creo otro con el mismo DIVnombre y lo pongo dentro de pero no tiene relleno y tiene . Me sale lo mismo, el ancho será de 220px.anotherdivnewdivnewdivnewdivanotherdivpadding-left: 20pxnewdiv

¿Como puedo solucionar este problema?

Apr 23 '09 05:04 Sam

Agregar propiedad:

-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */

Nota: Esto no funcionará en Internet Explorer por debajo de la versión 8.

Aug 20 '2012 08:08 Pramod

Pon un div en tu newdiv con width: autoymargin-left: 20px

Retire el relleno de newdiv.

La página del modelo W3 Box tiene buena información.

Apr 22 '2009 22:04 rvarcher