Comodo correcto cuando flota DIV

vissiontotal · #1 (**permalink**) 11/08/2011, 23:33

Hola amigos tengo un problema resulta queen mi pagina al utilizar un Div que flota hacia la izquierda dentro de otro.... en DW la vista diseño no se mira correctamente......... el div de afuera ignora al que esta dentro...... repido es solo en vista diseño porque ya en funcion trabaja perfecto.... puse el siguiente ejemplo con el que pasa lo mismo........ para no poner mucho codigo de la pagina....

Código:

<style type="text/css">
.principal {
	width: 500px;
}
.izq {
	width: 100px;
	float: left;
}
</style>
</head>

<body>
<div class="principal">Caja principal
  <div class="izq">Menu<br />
    Menu<br />
    Menu<br />
    Menu<br />
  </div>
</div>

alguien sabra como le puedo hacer para que e nvista diseño se mire correctamente.... si quito "float: left;"se mira bien que el de afuera rodea al de adentro como debe de ser.........

Batan · #2 (**permalink**) 12/08/2011, 03:12

Al flotar tu division su contenedor no la aceptará, ya que float lo que hace es por asi decirlo, independizarlo de su contenido, solo te lo posicionará respecto a su contenido.

Cuando lo visualizas en el navegador no te percatas del fallo debido ya que no hay ningun borde definido, si lo hicieses verias que no coge tu menu.
Para resoverlo puedes usar un overflow, que es la que se encarga de controlar el comportamiento del contenido.

Cita:

.izq {
overflow: hidden; /*Hará que se cree un contenedor ajustandose a tu menu, sin mostrar ningun scroll;*/
width: 100px;
float: left;
}

Si pusieses scroll en vez de hidden, crearia un scroll como el del navegador.
Si pusises none, no crearia ningun contenedor.

Saludos

vissiontotal · #3 (**permalink**) 12/08/2011, 11:37

probado y si me funciono en IE pero en Google Chorme no funciono con esa opcion...

ArturoGallegos · #4 (**permalink**) 12/08/2011, 12:17

el overflow debe estar en el padre no en el hijo

Código CSS:

Ver original.principal {
    width: 500px;overflow:hidden;
}

vissiontotal · #5 (**permalink**) 12/08/2011, 20:54

Sigue sin funcionar....... en ninguno de los dos div... ni en el padre ni en el hijo....

otra sugerencia.....
'

C2am · #6 (**permalink**) 12/08/2011, 21:09

¿Donde no te funciona?, porque primero hablas de la vista diseño del DW, y a decir verdad no importa como se vea ahí, donde se debe ver bien es en los navegadores.

En teoría lo que dijo Ag666 es la solución, así que estaria bueno que dieras mas precisiones, y de ser posible, si es que tienes subida la web, poner un link.

o prueba poniendo overflow:auto;
Saludos

Batan · #7 (**permalink**) 13/08/2011, 06:49

Bueno me disculpo por que lo hice rápido y no me percate que deje el overflow en el hijo y no en el padre.

Cita:

el overflow debe estar en el padre no en el hijo

Esa opción deberia funcionarte perfectamente, yo lo he echo y me funciona sin problemas, puede ser que tengas algun problema con tu menú.
Aqui lo pones por saltos de linea, pero no dudo que en tu proyecto los tengas como Div, y puede que te tengas algun problema con los estilos de esos DIV

Cita:

¿Donde no te funciona?, porque primero hablas de la vista diseño del DW, y a decir verdad no importa como se vea ahí, donde se debe ver bien es en los navegadores.

En teoría lo que dijo Ag666 es la solución, así que estaria bueno que dieras mas precisiones, y de ser posible, si es que tienes subida la web, poner un link.

o prueba poniendo overflow:auto;

Esa solución funciona en el dreamweaver.

Saludos.

vissiontotal · #8 (**permalink**) 14/08/2011, 23:21

Saludos y disculpas por la tardanza... efectivamente funciona con overflow en el padre.... se mira correctamente tanto en DW como los navegadores Chrome e Ie...