layout varia demasiado

derkenuke · #1 (**permalink**) 08/09/2005, 14:23

Tengo este codigo, para hacer un menu y para su contenido. Es sencillo:

Código PHP:

  <html>

<head>

<style>

#menu {

    display:inline;

    width:25%; height:100%;

    overflow:auto;

    border: solid 1px black;

    margin: 3px; padding:0;

    background-color: #ffffff;

}

#cuerpo {

    display:inline;

    width:70%; height:100%;

    overflow:auto;

    border: solid 1px black;

    margin: 3px; padding:0;

    background-color: #ffffff;

}

</style>

</head>

<body>

 
<div id="menu">

    <ul>

        <li>Elemento1</li>

        <li>Elemento2</li>

        <li>Elemento3</li>

        <li>Elemento4</li>

    </ul>

</div>

<div id="cuerpo">

    <p>El cuerpo de mi pagina, todos los contenidos que yo quiera.</p>

</div>

 
</body>

 
</html>

Como respuesta ideal: la que da IE (misteriosamente). ¿Alguien me dice porqué sale tan deformado en Opera y Firefox? (sale en los dos igual). No lo entiendo, ni siquiera los bordes. ¿Cual es la propiedad que falla?

gracias.

RoQ · #2 (**permalink**) 08/09/2005, 14:40

estas poniendo que un elemento de bloque se muestre como en linea, borra los display:inline y pon a flotar tu menu a la izquierda

derkenuke · #3 (**permalink**) 08/09/2005, 15:24

Ok, asi si funciona. En opera no existe diferencia de altura. En FF y IE si hay una pequeña diferencia de altura entre los dos <div>'s, vendran a ser 2 ó 3 px.

Y ¿no se puede poner un display:inline a un elemento de bloque? Porqué no lo acepta?

kemie · #4 (**permalink**) 09/09/2005, 02:32

si lo acepta, pero no puedes tener alto y ancho en un elemento en linea, y el elemento en linea tampoco podra tener elementos en bloque dentro de el.

derkenuke · #5 (**permalink**) 09/09/2005, 08:43

Aaammm, curioso, mira, una cosa que no sabia.

Gracias RoQ y kemie!