Foros del Web » Creando para Internet » CSS »

Duda con padding y width de un div

Estas en el tema de Duda con padding y width de un div en el foro de CSS en Foros del Web. Buenas, tengo un problemita, resulta que el firefox 5 hay un div con un padding y un width que se comporta de forma extraña y ...
  #1 (permalink)  
Antiguo 22/07/2011, 11:18
 
Fecha de Ingreso: septiembre-2008
Mensajes: 148
Antigüedad: 8 años, 6 meses
Puntos: 10
Duda con padding y width de un div

Buenas, tengo un problemita, resulta que el firefox 5 hay un div con un padding y un width que se comporta de forma extraña y por extraño que paresca en el IE8 funciona como debe ser.

Resulta que necesito hacerle un "marco" a una imagen. La imagen es de 250x100, debajo de la imagen hay texto centrado. Por lo tanto lo importante es que el "marco" quede en funcion del tamaño de la imagen, el marco debe de ser de 5px, por lo que use el padding = 5px; ademas como la imagen es de 250 de ancho le mande logicamente al div un width=260 (250 de la imagen mas 5 de cada lado por el padding).

Pero resulta que el div me queda de 270 de ancho (260 del width mas los 5 de cada lado del padding)... se supone que el padding se suma al tamaño final del width?????
  #2 (permalink)  
Antiguo 22/07/2011, 16:03
 
Fecha de Ingreso: febrero-2010
Ubicación: Montevideo
Mensajes: 105
Antigüedad: 7 años, 1 mes
Puntos: 19
Respuesta: Duda con padding y width de un div

El modelo de css establece que el padding de cada elemento se suma al ancho total. Entonces si tienes un elemento de 150px de ancho y le agregas padding de 5px a la izquierda y a la derecha, te quedará de 160px.

Tu lo hiciste al revés, y en realidad el que se comporta "mal" es internet explorer que no respeta los estándares de css.
__________________
Federico Silva Ponte
www.fedesilva.com
  #3 (permalink)  
Antiguo 22/07/2011, 16:06
 
Fecha de Ingreso: febrero-2010
Ubicación: Montevideo
Mensajes: 105
Antigüedad: 7 años, 1 mes
Puntos: 19
Respuesta: Duda con padding y width de un div

Lo que puedes hacer para que te funcione igual en todos los navegadores es en lugar de agregarle padding al contenedor, agregarle margen a la imágen. Entonces el div quedaría del mismo tamaño.
__________________
Federico Silva Ponte
www.fedesilva.com

Etiquetas: ancho, firefox, padding, tamaño, width
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:56.