Foros del Web » Creando para Internet » CSS »

CSS padding/margin por defecto... o qué?

Estas en el tema de CSS padding/margin por defecto... o qué? en el foro de CSS en Foros del Web. Hola a todos, tengo el siguiente problema... a ver si alguien puede darme una mano! Tengo un div contenedor, con ancho de 880px y dentro ...
  #1 (permalink)  
Antiguo 27/06/2019, 14:36
 
Fecha de Ingreso: marzo-2010
Mensajes: 63
Antigüedad: 9 años, 8 meses
Puntos: 4
CSS padding/margin por defecto... o qué?

Hola a todos, tengo el siguiente problema... a ver si alguien puede darme una mano!

Tengo un div contenedor, con ancho de 880px y dentro de él, 3 divs (inline-block) de 240px de ancho. El div central, tiene margin left/right de 80px... por lo que: (si 240+80+240+80+240=880) debieran calzar JUSTO los 3 divs y los márgenes establecidos, en el contenedor... PERO NO!

Resulta que al inspeccionar los elementos en el navegador, aparece un espacio muerto (margin/padding?) entre los divs, generando que excedan los 880px con lo que el último div... se va para abajo!

Alguna idea?? Pleaseeeee?
  #2 (permalink)  
Antiguo 27/06/2019, 14:43
 
Fecha de Ingreso: marzo-2010
Mensajes: 63
Antigüedad: 9 años, 8 meses
Puntos: 4
Respuesta: CSS padding/margin por defecto... o qué?

Cita:
Iniciado por Speedbit Ver Mensaje
Hola a todos, tengo el siguiente problema... a ver si alguien puede darme una mano!

Tengo un div contenedor, con ancho de 880px y dentro de él, 3 divs (inline-block) de 240px de ancho. El div central, tiene margin left/right de 80px... por lo que: (si 240+80+240+80+240=880) debieran calzar JUSTO los 3 divs y los márgenes establecidos, en el contenedor... PERO NO!

Resulta que al inspeccionar los elementos en el navegador, aparece un espacio muerto (margin/padding?) entre los divs, generando que excedan los 880px con lo que el último div... se va para abajo!

Alguna idea?? Pleaseeeee?

La verdad es que encontré la solución antes de lo esperado y pensé en quitar mi consulta... pero quizás le sirva a alguien?
Me pareció mejor compartirla y si no corresponde, me avisan y lo borro! jejeje

La respuesta está aqui: https://ed.team/blog/css-espacios-fa...-solucionarlos
y aunque trata de imágenes, ese parece ser el problema, al trabajar con objetos "inline".

Saludos y gracias a todos! =)
  #3 (permalink)  
Antiguo 27/06/2019, 15:48
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 6.553
Antigüedad: 11 años, 8 meses
Puntos: 1085
Respuesta: CSS padding/margin por defecto... o qué?

Es algo bastante común cuando se trata de imágenes, pero no sabia que aplicaba a inline-block, tomo nota y se agradece el compartir tu experiencia.
  #4 (permalink)  
Antiguo 27/06/2019, 16:09
 
Fecha de Ingreso: marzo-2010
Mensajes: 63
Antigüedad: 9 años, 8 meses
Puntos: 4
Respuesta: CSS padding/margin por defecto... o qué?

Cita:
Iniciado por ArturoGallegos Ver Mensaje
Es algo bastante común cuando se trata de imágenes, pero no sabia que aplicaba a inline-block, tomo nota y se agradece el compartir tu experiencia.
Mis conocimientos no dan para asegurar nada... y por eso me tomé el trabajo de incluir el "parece" ser"! jejeje

Pero estaría bueno (sólo por ilustrarnos un poquito) que alguien que la tenga clara, pueda dar más detalles... sólo por ponerme un poquito más lejos de la ignorancia! eh?

Saludos, =)
  #5 (permalink)  
Antiguo 01/07/2019, 11:59
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.425
Antigüedad: 17 años, 5 meses
Puntos: 175
Respuesta: CSS padding/margin por defecto... o qué?

probaste con el 'box-sizing' https://developer.mozilla.org/es/doc...CSS/box-sizing ?
no deberias editar nada ni agregar nada.

OJO, esto no es correcto para nada! https://ed.team/blog/css-espacios-fa...-solucionarlos
__________________
Desarrollos dosLotos
Calendario Maya, Meditación, Osho
  #6 (permalink)  
Antiguo 10/07/2019, 15:42
 
Fecha de Ingreso: marzo-2010
Mensajes: 63
Antigüedad: 9 años, 8 meses
Puntos: 4
Respuesta: CSS padding/margin por defecto... o qué?

Cita:
Iniciado por DragonX Ver Mensaje
probaste con el 'box-sizing' https://developer.mozilla.org/es/doc...CSS/box-sizing ?
no deberias editar nada ni agregar nada.

OJO, esto no es correcto para nada! https://ed.team/blog/css-espacios-fa...-solucionarlos
No lo probé con "box-sizing", pero luego de leer varias opciones sobre el tema (aún después de haberlo resuelto)... asumo que sí, es otra posibilidad!

Sólo que ya "había quedado"... y tuve que seguir adelante con otras cosas! jejeje



La zona horaria es GMT -6. Ahora son las 13:58.