No me respeta el tamaño de los div

Pinty · #1 (**permalink**) 15/06/2011, 07:32

Hola a todos. Tengo un pequeño problema a la hora de hacer las css de mi pagina web. Queria hacer una prueba antes de hacer el codigo solo para ver como quedarian los componentes. Nunca me habia pasado antes pero, cuando ejecuto la web bacia, es decir sin campos de texto, sin botones etc, no me muestra nada la pantalla. Si pongo por ejemplo en un div que ocupa el 50% de la pantalla, si le pongo una etiqueta <h1> me muestra solo el div adaptado al tamaño del texto.
Por ejemplo el siguiente codigo.

Código CSS:

Ver originalbody {
    width: 100%;
    height: 100%;
    background-color:Aqua;
    color:Black;
}
 
.pagina{
    width:1024px;
    height:768px;
    position:absolute;
    left:50%;
    margin-left:-512px;
    background-color:Black;
}
 
/*Definicion general de la pagina*/
.cabecera{
    position:static;
    width: 100%;
    height: 15%;
    background-color: fuchsia;
}
 
.cuerpo{
    position: static;
    width: 100%;
    height: 77%;
    background-color: maroon;
}

Si por ejemplo escribo algo en el cuerpo solo me muestra el cuerpo que ocupa el texto que yo escriba, el resto me lo pone del color del fondo de la pagina.

Espero que alguien me pueda echar una mano. Muchas gracias por adelantado
Un saludo

Noé Montes

Dalvenjha · #2 (**permalink**) 15/06/2011, 08:07

¿Pq usas posiciones estaticas y absolutas? no tienes necesidad de eso, por otro lado no veo el html pero lo adivino, cambia eso, a posicines relativas.

Saludos

Pinty · #3 (**permalink**) 18/06/2011, 09:04

Hola Dalvenjha. En primer lugar muchas gracias por contestar. Quieres decir q utilice siempre posiciones relativas?? Lo he intentado pero el problema es el mismo. Es decir solo me muestra el div si tiene algun texto o algo de contenido dentro. Nunca antes me habia pasado, aunque no pusiese nada dentro de los div estos se me mostraban igual y del tamaño que yo los pedia.
Perdon por no poner el codigo html. Mira es este:

Código HTML:

Ver original<body>
        <div class="pagina">
            <form id="formulario1" runat="server">
                <div class="cabecera">
                    <h3>Cabecera</h3>
                </div>
                <div class="menu_superior">
                     <h3>Menu</h3>
                </div>
                <div class="cuerpo">
                    <div class="contenido">
                        <asp:ContentPlaceHolder ID="MainContent" runat="server">
                        </asp:ContentPlaceHolder>
                    </div>
                    <div class="menu_lateral">
                        <h3>M_lateral</h3>
                    </div>
                </div>
                <div class="pie">
                    <h3>Pie</h3>
                </div>
            </form>
        </div>
    </body>

Muchas gracias nuevamente. Un saludo
Pinty

Pinty · #4 (**permalink**) 18/06/2011, 09:07

Me acabo de dar cuenta de una cosa.
Si las css se las aplico a un webform normal, me respeta todos los tamaños aunque no tenga contenido dentro, el problema me lo da en las masterpages.
Es pura coincidencia o tiene algo de relacion??

Gracias por vuestra ayuda. Saludos

maximilianojcelis · #5 (**permalink**) 18/06/2011, 18:46

Un consejito.. Para aplicar un color.. no pongas el color por su nombre.. dado que diferentes navegadores pueden interpretar los colores de diferente forma, por ejemplo, puede que el red en firefox te salga de un tono y en chrome de otro, variando un poco los colores.. define los colores con codigos hexadecimales y veras...

Pinty · #6 (**permalink**) 19/06/2011, 06:38

Hola maximilianojcelis. Muchas gracias por tu aportacion, la verdad que solo utilizaba hexadecimal para colores que no vienen definidos por defecto, es decir por ejemplo tonalidades mas oscruas de rojo y cosas asi, pero si queria rojo plantaba "red" y me quedaba tan feliz.
Muchas gracias de nuevo, no sabras por casualidad el tema de los tamaños no?? es que me estraña muchisimo que si hago un webform normal me lo respete como siempre, pero si es la master page me respeta los tamaños maximos, pero no los minimos, es decir q se adapta al texto que introduzcas y si sobra espacio no lo pone. La verdad que me parece rarisimo.

Un saludo
Pinty