Acercar elementos a los margenes del documento

crujikoki · #1 (**permalink**) 01/08/2008, 02:35

Hola,

No se si el título deja muy claro lo que quiero hacer, pero lo explico mejor por si a caso.

Lo que me sucede esque tengo un div que va a contener mi menú horizontal y será fijo. Lo que no consigo hacer es que obtenga todo el ancho del documento y que a más a más se pegue a los margenes superior y izquierdo del documento... No se si me he explicado muy bien. Para solucionar cualquier duda que tengais al respecto os adjunto el cófigo:

Código PHP:

   
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

    <head>

        <title>Filmoteca</title>

        <style type="text/css">

            

            body

            {

                background-color: #000000;

            }

            

            h2

            {

                color: #FFFFFF;

                font-family: sans-serif;

            }

            

            div.seleccion

            {

                margin-top: 150px;

            }

            

            .boton

            {

                color:white;

                background:#638cb5;

                /*border:0px;*/

                width:120px;

                height:30px;

            }

 
            .menu

            {

                width: 100%;

                background: #eee none;

            }

            

            .menu ul

            {

                float:left;

                width:100%;

                padding:0;

                margin:0;

                list-style-type:none;

            }

            

            .menu a

            {

                float:left;

                width:6em;

                text-decoration:none;

                color:white;

                background-color:#eee;

                padding:0.2em 0.6em;

                border-right:1px solid white;

            }

            

            .menu a:hover

            {

                background-color:#ff3300

            }

            

            .menu li

            {

                display:inline

            }

        </style>

    </head>

    <body>

        <div class="menu">

            <ul>

                <li><a href="#">A&ntilde;adir</a></li>

                <li><a href="#">Consultar</a></li>

            </ul>

        </div>        

    </body>

</html>

Evidentemente puedo acercar el div al margen poniéndole un margin-left negativo y listos, pero a parte de que no me parece muy elegante creo que si la resolución de la pantalla es diferente me joderá el diseño.

Otra cosa, puede ser por esto?: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

La verda que no tengo conocimientos profundos sobre el tema y por eso tengo estas dudas y quizás he dicho alguna tontería. Agradezco cualquier tipo de ayuda.

Muchas gracias de antemano!!!

Mikmoro · #2 (**permalink**) 01/08/2008, 02:38

Prueba añadiendo esto al principio de los estilos:

* {margin: 0; padding: 0;}

Puede que eso te descuadre alguna otra cosa, porque lo que hace es eliminar los márgenes y rellenos por defecto de la mayoría de los elementos.

crujikoki · #3 (**permalink**) 01/08/2008, 03:25

Eres grande tio!!!
Se me ha pegado a los margenes que ni hecho a medida. Pero ahora me pasa otra cosilla, que aun que le ponga la anchura al 100% por la derecha me queda un huequecillo muy feo... Lo podría solucuionar poniendo más pixels que el máximo de la pantalla y quitando el scroll horizontal pero también me parece poco profesionar...

Tienes/eis alguna colución para esto?
Muchas gracias!!!

Mikmoro · #4 (**permalink**) 01/08/2008, 04:10

¿Qué elemento es el que quieres poner al 100%? Si es un div, y no tiene nada raro sin ponerle width debería ocupar el 100%.
Si es el "ul", para que coja el 100% deberás añadir:

html, body {width: 100%;}

crujikoki · #5 (**permalink**) 01/08/2008, 05:40

Hola,
Gracias por responder nuevamente. Pero si no lepongo el width al div se me acorta hasta el límite del menú (del ul).

Creo que lo haré a lo cutre y listos, tampoco es tan grabe.

Saludos y muchas gracias de nuevo!

Mikmoro · #6 (**permalink**) 01/08/2008, 07:07

No creo que se te corte, pero para saberlo seguro, añade al div un borde tipo

border: solid 1px #f00

Así verás sus bordes y sabrás hasta dónde llega. Lo que creo más bien que te ocurre es que en realidad estás viendo el fondo del "ul" y no del div. Imagino.