Foros del Web » Creando para Internet » CSS »

Ancho de layout confución

Estas en el tema de Ancho de layout confución en el foro de CSS en Foros del Web. Buenas amigos, por fin ya he comprendido un poco el css y e hecho varias maquetaciones pero aun mi conocimiento es limitado porque cuando hago ...
  #1 (permalink)  
Antiguo 16/07/2011, 08:55
Avatar de DoPeY-BBS  
Fecha de Ingreso: octubre-2005
Ubicación: Santo Domingo, Dominican Republic, Dominican Republic
Mensajes: 574
Antigüedad: 19 años
Puntos: 12
Ancho de layout confución

Buenas amigos, por fin ya he comprendido un poco el css y e hecho varias maquetaciones pero aun mi conocimiento es limitado porque cuando hago por ejemplo una maquetacion, ya sea de dos o tres columnas, solamente con sumarle el ancho para que sean igual al contenedor. lo se... pero... aqu viene lo que me tiene confundido

Cita:
ancho = a las sumas de los border + padding + margin
pero tambien he visto una formula que es

700/2 = al ancho de columna
luego esa cantidad se resta

para optener el margin y el padding...


He buscado esto ultimo pero no se exactamente como poner para dar con la respuesta..

necesito ayuda..

Gracias
__________________
http://www.htmldog.com/HTML, CSS, and JavaScript,

http://tutorialphp.net/
Aprende PHP en 12 capítulos
  #2 (permalink)  
Antiguo 16/07/2011, 09:03
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 14 años, 3 meses
Puntos: 64
Respuesta: Ancho de layout confución

Una formula ??? ... =/ No entiendo muy bien que es lo que queres saber,...
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #3 (permalink)  
Antiguo 16/07/2011, 09:39
Avatar de DoPeY-BBS  
Fecha de Ingreso: octubre-2005
Ubicación: Santo Domingo, Dominican Republic, Dominican Republic
Mensajes: 574
Antigüedad: 19 años
Puntos: 12
Respuesta: Ancho de layout confución

El margin + el padding + el border tiene que ser del mismo ancho del contenedor. ¿cierto? bueno, la cosa es que quiero saber como es que esa formula funciona. o sea, quiero saber la logica de como se llego a esa conclucion y cuales fueron los pasos.
__________________
http://www.htmldog.com/HTML, CSS, and JavaScript,

http://tutorialphp.net/
Aprende PHP en 12 capítulos
  #4 (permalink)  
Antiguo 16/07/2011, 10:54
Avatar de pitufoweb  
Fecha de Ingreso: enero-2008
Ubicación: Un Mundo Raro
Mensajes: 1.148
Antigüedad: 16 años, 10 meses
Puntos: 181
Respuesta: Ancho de layout confución

Creo que si te olvidas de margin, seria mas fácil de entender.


si tienes un Div de 300px de ancho, luego le das 10px de Padding (alrededor) y 1px de Border (alrededor), el ancho total del Div seria de 322px.

300px(Width) + 20px(Padding) + 2px(Border) = 322px



Pero si el Div tiene que ser de 300px de ancho, tendremos que restarle esos 22px que sobran. Entonces al Div le daríamos 278px de Width, para que en total sean 300px.



P.D. Creo que ni yo mismo me entendí.







Saludos
__________________
------------- " La felicidad no llega de afuera, nace desde dentro. " -------------

Última edición por pitufoweb; 16/07/2011 a las 12:38
  #5 (permalink)  
Antiguo 16/07/2011, 15:45
Avatar de DoPeY-BBS  
Fecha de Ingreso: octubre-2005
Ubicación: Santo Domingo, Dominican Republic, Dominican Republic
Mensajes: 574
Antigüedad: 19 años
Puntos: 12
Respuesta: Ancho de layout confución

Si no me equivoco, es esto

Cita:
width de el contenedor = 360px
Entonces si tenemos dos columnas debemos hacer este cálculo:
360/2 = 180
180-20(margin-left y margin right) = 160
160 - 10 (padding-left y padding-right) = 150
150 - 4 (border-left y border-right) = 154
width de la columna = 154px
*/
__________________
http://www.htmldog.com/HTML, CSS, and JavaScript,

http://tutorialphp.net/
Aprende PHP en 12 capítulos

Última edición por DoPeY-BBS; 16/07/2011 a las 16:45
  #6 (permalink)  
Antiguo 16/07/2011, 17:02
Avatar de pitufoweb  
Fecha de Ingreso: enero-2008
Ubicación: Un Mundo Raro
Mensajes: 1.148
Antigüedad: 16 años, 10 meses
Puntos: 181
Respuesta: Ancho de layout confución

mmm, si, algo así.


pero creo que te fallaron los números.


360/2 = 180

180-20 = 160

160 - 10 = 150

150 - 4 = 146

width de la columna = 154px


width de la columna = 146px



Ahora si quisieras tener solo UNA columna de 500px de ancho, con 5px de padding(left and right), 5px margin(left and right) y 1px de border(left and right), como lo harías?


Saludos
__________________
------------- " La felicidad no llega de afuera, nace desde dentro. " -------------

Última edición por pitufoweb; 16/07/2011 a las 17:07
  #7 (permalink)  
Antiguo 16/07/2011, 17:11
Avatar de DoPeY-BBS  
Fecha de Ingreso: octubre-2005
Ubicación: Santo Domingo, Dominican Republic, Dominican Republic
Mensajes: 574
Antigüedad: 19 años
Puntos: 12
Respuesta: Ancho de layout confución

Gracias.

Esto era lo que andaba buscando
__________________
http://www.htmldog.com/HTML, CSS, and JavaScript,

http://tutorialphp.net/
Aprende PHP en 12 capítulos
  #8 (permalink)  
Antiguo 16/07/2011, 17:38
Avatar de DoPeY-BBS  
Fecha de Ingreso: octubre-2005
Ubicación: Santo Domingo, Dominican Republic, Dominican Republic
Mensajes: 574
Antigüedad: 19 años
Puntos: 12
Respuesta: Ancho de layout confución

Hecho, el ejercicio

mandado al pm
__________________
http://www.htmldog.com/HTML, CSS, and JavaScript,

http://tutorialphp.net/
Aprende PHP en 12 capítulos

Última edición por DoPeY-BBS; 17/07/2011 a las 02:37

Etiquetas: ancho, layout
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 23:42.