Dos problemas y uno es con IE ¬¬

karlic0s · #1 (**permalink**) 01/03/2009, 15:08

Primero, que es el equivalente en css a poner width=* (en html)

tengo tres divs horizontales y quiero que me ocupen el 100% y tienen esta organizacion:

10px - (el que quiero que ocupe lo que sobra de la pagina) - 10px.

El otro proble con IE es el siguiente:

En firefox se me ven los estilos de los divs, pero en IE no se ven, alguien sabe por que?

Copio el código:

Código PHP:

  <head>
<style type="text/css">

body{
background: url(images/bg.jpg);
background-repeat: repeat-x;
background-attachment: fixed;
margin:0;
padding:0;
}

div.contenedor{
width: 100%;"
margin: auto;
display: table;
margin-left: auto;
margin-right: auto;
} 

div.login{
height: 35px;
width: 100%;
background-color:#616161;
}

div.logo{
float: left;
height: 87px;
width: 20px;
}

div.publicabecera{
float: right;
height: 87px;
width: 80%;
}

div.part1{
float: left;
height: 82px;
width: 16px;
background: url(images/img_10.jpg);
}

div.part2{
float: left;
height: 82px;
width: 468;
background: url(images/img_05.jpg);
}

div.part3{
float: left;
height: 82px;
width: 40%;
background: url(images/img_06.jpg);
background-repeat: repeat-x;
}

div.part4{
float: left;
height: 82px;
width: 17px;
background: url(images/img_08.jpg);
}

div.part5{
float: left;
height: 82px;
width: 16px;
background: url(images/img_11.jpg);
}

div.part11{
float: left;
height: 800px;
width: 16px;
background: url(images/img_0911.jpg);
}

div.part12{
float: left;
height: 800px;
width: 800px;
background-color: #FFFFFF;
}

div.part13{
float: right;
height: 800px;
width: 16px;
background: url(images/img_0911.jpg);
}

</style>
<head>


<div class="contenedor">
    <div class="login"></div>
    <div class="logo"></div>
    <div class="publicabecera"></div>
    <div style = "height: 82px; width: 100%; clear: both;">
        <div class="part1"></div>
        <div class="part2"></div>
        <div class="part3"></div>
        <div class="part4"></div>
        <div class="part5"></div>
    </div>
    <div style = "height: 82px; width: 100%; clear: both;">
        <div class="part11"></div>
        <div class="part12">asdasdsad</div>
        <div class="part13"></div>
    </div>

    <div style = "clear: both; height: 35px; width: 100%; background-color:#616161;"></div>
</div>

jomaruro · #2 (**permalink**) 01/03/2009, 15:41

Hola:

Creo que el error está aquí:

Cita:

div.contenedor{
width: 100%;"
margin: auto;
display: table;
margin-left: auto;
margin-right: auto;
}

Suprime lo que te he marcado en rojo.

Saludos.

karlic0s · #3 (**permalink**) 01/03/2009, 15:45

Mil gracias jomaru! funciona bien ^^

No me di cuenta de esas comillas :S respecto al otro tema... alguien sabe como hacerlo?

Me extiendo un poco mas, tres divs horizontales, quiero que entre los tres me ocupen una pagina entera a lo ancho el primero y el tercer ocupan 10px y quiero que el del centro (segundo) me ocupe lo que sobra de la pagina, alguna solucion?

jomaruro · #4 (**permalink**) 01/03/2009, 15:48

Hola de nuevo:

Me olvidé del problema de los div's horizontales, vísita esta pagina, concretamente el apartado diseño líquido de 3 columnas, es lo que te hace falta.

Saludos.

karlic0s · #5 (**permalink**) 01/03/2009, 16:17

#col_der, #col_izq, #col_cen {height: 100%;}

#col_der {float: right;
width: 16px;
background: url(images/img_09.jpg);
background-repeat: no-repeat;
}

#col_izq {
float: left;
width: 16px;
background: url(images/img_09.jpg);
background-repeat: no-repeat;
}

#col_cen {
background-color: #FFFFFF;
}

Funciona perfectamente, pero ahora bien... ocupa el 100% de alto, si yo quiero que ocupe mas del 100% porque el texto que he metido dentro del div es mas grande? que debo hacer? si quito: #col_der, #col_izq, #col_cen {height: 100%;} se me descentra todo y no me funciona, alguna solucion? Muchas gracias jomaruru por tus respuestas, se agradece :)