Foros del Web » Creando para Internet » HTML »

problema de etiquetas div con el navegador mozilla

Estas en el tema de problema de etiquetas div con el navegador mozilla en el foro de HTML en Foros del Web. Hola a todos. Mi duda es la siguiente: Tengo una pagina web en la que he incluido una etiqueta div de la siguiente forma: div ...
  #1 (permalink)  
Antiguo 08/08/2004, 06:26
 
Fecha de Ingreso: marzo-2004
Mensajes: 550
Antigüedad: 13 años, 9 meses
Puntos: 5
Sonrisa problema de etiquetas div con el navegador mozilla

Hola a todos. Mi duda es la siguiente:

Tengo una pagina web en la que he incluido una etiqueta div de la siguiente forma:

div style="margin:10px; margin-top:5px; ">
<div class="smallfont" style="margin-bottom:2px"></div>
<div class='alt2' style='margin:0px; padding:6px; border:1px inset; width:100%; height:200px; overflow:auto'>
<code style="white-space:nowrap">
<code><font color="#000000">

.................................................. ..................................
.................................................. ..................................

</font>
</code>
</code>
</div>



pero no se porque con el internet explorer me hace una especie de cuadrado rodeando a todo lo que tengo dentro quedando perfectamente encuandrado todo pero con el mozilla este cuadrado me aparece mucho mas ancho apareciendo unas barras de scroll horizontales porque la ventana se hace mucho mas grande y por tanto no se puede ver toda la página de una vez.

¿porque con mozilla no me queda igual de bien que con el explorer?

¿porque con el mozilla aunque le pongo en la etiqueta div el 100% de la página me estira mucho mas ésta quedando mal encuadrada la pagina?

Un saludo.
  #2 (permalink)  
Antiguo 08/08/2004, 07:12
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Hola aeb_asturias

Es una cuestión de forma de interpretación.

Cuando a un bloque le asignas un valor a la propiedad width se lo estás asignando a su contenido. Si además le asignas un padding, un border y/o un margin lo agregará a la parte externa del contenido.

Es decir, si creas un contenedor de width: 200px y le aplicas además un padding de 10px esos 10px los pondrá alrededor del área de contenidos que yá mide 200px de ancho, con lo que ocupará una anchura total de 220px (los 200 del contenido más 10px por cada extremo horizontal).

En el código que estás usando sucede....

<div style="margin:10px; margin-top:5px; ">

No le asignas una anchura, con lo que tomará por defecto el ancho total de su contenedor. Si su contendor es body, pues toma el ancho de body

<div class='alt2' style='margin:0px; padding:6px; border:1px inset; width:100%; height:200px; overflow:auto'>

Le asignas un width del 100%, así que toma el 100% del contenedor que lo contiene, que yá ocupa el 100%.
Padding: 6px le agrega a ese 100% 6px más por cada lado, lo que suman 12px sobre el 100% de la anchura de body
border: 1px le agrega otro pixel a cada lado, que sumado a los 12 de padding dan 14px.

Esos 14px son los que provocan que salga la barra de desplazamiento horizontal.


Internet Explorer en cambio no lo hace así, si no que cuando le asignas 200px a un contendor, siempre su anchura total será de 200, independientemente del padding etc que le asignes. En IE las dimensiones del padding, border y margin son restadas del espacio del contenido.

Jo, no sé yo si he logrado explicarme....

Puedes leer info detallada aquí
http://www.sidar.org/recur/desdi/tra...width-property

y aquí
http://www.sidar.org/recur/desdi/tra...box-dimensions
  #3 (permalink)  
Antiguo 08/08/2004, 11:49
Avatar de KnowDemon  
Fecha de Ingreso: julio-2004
Ubicación: Ciudad de México
Mensajes: 544
Antigüedad: 13 años, 5 meses
Puntos: 2
Lo que dice Tunait es correcto, pero OJO: el que está haciendo las cosas MAL es el EXPLORER. La recomendacion de la W3C es como lo hace el Mozilla.
__________________
Mi pequeño espacio en la web: VisiónE
"El cosmos es todo lo que es, todo lo que fue, y todo lo que será alguna vez."
  #4 (permalink)  
Antiguo 08/08/2004, 12:05
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Cita:
OJO: el que está haciendo las cosas MAL es el EXPLORER
of course para no perder la costumbre
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 21:52.