Imprimir Página - Problema con elementos flotantes y su fondo

Título: Problema con elementos flotantes y su fondo
Publicado por: KaozC9 en 3 Junio 2010, 18:26 pm

ara que al hacer un menu transparente no suceda esto, que debo hacer?
(http://www.uploadgeek.com/image-086D_4C06EEB0.jpg)

mi css es este

Código

#menul {
float: left;
width: 25px;
height: 55px;
background: url('images/mbar_l.png') no-repeat;
}
#menur {
float: right;
width: 25px;
height: 55px;
background: url('images/mbar_r.png') no-repeat;
}
#menum {
width: 100%;
height: 55px;
background: url('images/mbar_m.png') repeat-x;
}

y el html

Código

<div id="menul">
</div>
<div id="menur">
</div>
<div id="menum">
</div>

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: Gorky en 4 Junio 2010, 00:24 am

Que no suceda el que?

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: KaozC9 en 4 Junio 2010, 00:55 am

ves que son tres div, con tres fondos, uno es el de la esquina derecha, otro es el de la izquierda, y el del medio que se va repitiendo a lo largo del eje X, bueno, las esquinas son transparentes, por lo cual se ve tambien lo que se esta repitiendo.. quiero que se vea asi
(http://www.uploadgeek.com/image-713A_4C0823A5.jpg)

y NO asi
(http://www.uploadgeek.com/image-086D_4C06EEB0.jpg)

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: MinusFour en 4 Junio 2010, 03:10 am

Creo que es porque menuM esta al 100% en width.

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: KaozC9 en 4 Junio 2010, 03:55 am

Cita de: MinusFour en 4 Junio 2010, 03:10 am

Creo que es porque menuM esta al 100% en width.

claro, esto es porque quiero que sea dinamico, pero debe haber una forma para que no se muestre lo que esta "bajo" menur y menul

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: Cygog en 4 Junio 2010, 04:24 am

la verdad es que no he entendido bien lo que preguntastes.. pero si creo que es que quieres tener tres divs juntos con un background el problemas lo tienes en el tamaño de los divs o tambien puedes modificar los float para que quede bien posisionado...

---- ---- ----

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: KaozC9 en 4 Junio 2010, 04:34 am

quiero que sea asi
(http://www.uploadgeek.com/image-CAE7_4C0856F4.jpg)

como ves, donde esta marcado rojo, el elemento menum interfiere con menul, y eso no quiero que pase, tanto en la izq como en la derecha, porque si coloco un margin: 0 25px; por ejemplo, desaparece solo en la izq, pero en la derecha sigue habiendo esa interferencia

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: Cygog en 4 Junio 2010, 04:52 am

aaa yaya creo que ya entendi tu pregunta.. agrega un padding a el div cental de 10px y ya..
si no lo haz podido arreglar subi el source como fichero adjunto asi lo arreglo y te lo paso

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: KaozC9 en 4 Junio 2010, 05:01 am

bueno aqui esta el link a mediafire
http://www.mediafire.com/?n3zdtnmwddn
es asi

menu.html
mbar_r.png
mbar_l.png
mbar_m.png

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: Cygog en 4 Junio 2010, 22:30 pm

he visto lo que deceas hacer.. y el problema que tienes es que al div centro no le haz puesto el float..

<html>
<head>

<style type="text/css">
       #cont {
          padding:10px;
          width:100%;
          height:65px;

             }
#izquierda {
            width:25px;
            height:55px;
            float:left;
            background-image:url(mbar_l.png)
             }
                    #centro {
                      width:90%;
                      height:55px;
                       float:left;
                      background-image:url(mbar_m.png)


                     }
                     #derecho {
                        width:25px;
                        height:55px;
                        float:left;
                        background-image:url(mbar_r.png)
                        }



</style>
</head>

<body>

<div id="cont">
<div id="izquierda"></div>

<div id="centro"></div>

<div id="derecho"></div>
</div>

</body>
</html>

lo recomendable seria que uses para el div centro px en vez de %

Título: Re: Problema con elementos flotantes y su fondo
Publicado por: KaozC9 en 4 Junio 2010, 23:02 pm

Gracias por la ayuda Cygog :D Te lo agradezco muchisimo (:

Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: KaozC9 en 3 Junio 2010, 18:26 pm