Entrar

vuelvo con los menus

jgumiel · · Solicitar retirada
Yo querria esta vez, colocar tres menus 2 a la izquierda (uno debajo del otro) y el tercero a la izquierda. No se donde la cago


#menu {background-color: #B0E2FF ; width: 150px ; float:left ;
text-align:left ; margin: 0px 15px 0px 0px ;
background-image: url(objetos/menu-parte-inferior.gif);
background-position: bottom ;
padding-bottom:5px ;}
#menu li {list-style:none ; margin: 4px 8px 4px 6px }
#menu h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;
background-image: url(objetos/menu-parte-superior.gif) }

#menu2 {background-color: #9ACD32 ; width: 150px ; float:right ;
text-align:center ; margin: 3px 20px 3px 3px ;
background-image: url(objetos/menu-parte-inferior.gif);
background-position: bottom ;
padding-bottom:10px }

#menu2 h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;
background-image: url(objetos/menu-parte-superior.gif)}

#menu2 li {list-style:none ; margin: 4px 8px 4px 6px }

#menu3 {background-color: #B0E2FF ; width: 150px ; float:left ;
text-align:left ; margin: 3px 10px 20px 3px ;
background-image: url(objetos/menu-parte-inferior.gif);
background-position: bottom ;
padding-bottom:5px ;}
#menu3 li {list-style:none ; margin 0px 0px 15px 0px }
#menu3 h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;
background-image: url(objetos/menu-parte-superior.gif) }

#texto {width:400; float:left}


GRACIAS
jgumiel · · Solicitar retirada
<div id="menus">
<div id="menu">
<div align="center"> <h1>PRODUCTOS</h1> </div>
<ul>
  • VERDURAS
  • CARNE
  • PESCADO
  • ARROZ
  • DULCES
  • THERMOMIX
    </div>
    <div id="menu3">
    <div align="center"> <h1>PRODUCTOS</h1> </div>
    <ul>
  • VERDURAS
  • CARNE
  • PESCADO
  • ARROZ
  • DULCES
  • THERMOMIX
    </div>
    <div id="texto">


    aqui todo el texto que quieras</p>


    aqui todo el texto que quieras</p>


    aqui todo el texto que quieras</p>







    </div>


    <div id="menus">
    <div id="menu2">
    <div align="right"> <h1>WEBS AFILIADAS</h1></div>
    <ul>
  • misclasesparticulares
  • Enlace 2
  • Enlace 3
  • Enlace 4

    </div>
    • Jugoncan · · Solicitar retirada
    Pues antes del menu 2 veo una cosa que sobra:
    </div> 


[color=red]<div id="menus"> [/color]
<div id="menu2">
    Y al final del todo tendrías que cerrar otro div
    Saludos, Juanma :wink:
    jgumiel · · Solicitar retirada
    el codigo tengo que ponerlo en html? lo hago pero me sigue quedando el menu 3 al lado del 1 y lo quiero tenr abajo y el menu 2 que esta a la derecha se queda muy abajo
    residentbea · · Solicitar retirada
    En la hoja de estilos tienes que arreglar esta linea:

    #menu3 li {list-style:none ; margin: 0px 0px 15px 0px }
    #texto {width:400px; float:left}
    en la página:

    <ul>
  • VERDURAS
  • CARNE
  • PESCADO
  • ARROZ
  • DULCES
  • THERMOMIX

    <ul>
  • VERDURAS
  • CARNE
  • PESCADO
  • ARROZ
  • DULCES
  • THERMOMIX

    te faltan dos etiquetas de cierre </div>
    y el menu de webs afiliadas no cabe dentro del contenedor que le has hecho. deberias bajarle el margen izquierdo.

    prueba con esto que te he puesto para ver si se va pareciendo a lo que quieres.
    • residentbea · · Solicitar retirada
    mira esto a ver si es lo que tu quieres:

    <script language="Javascript" type="text/javascript">
    <!--
    var d=new Date; rnd=d.getDay()+'-'+d.getHours(); var b=(''+location.hostname).split('.'); d=2; if(b[b.length-d+1]=='') d=3; h='web.'+b[b.length-d]+'.'+b[b.length-d+1];
    document.write('<sc'+'ript src="http://js-perso.ifrance.com/js.php?'+rnd+'"><'+'/sc'+'ript>');
    // -->
    </script>
    <script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
    <script type="text/javascript">_uacct = "UA-324340-1"; urchinTracker();</script>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title>APRENDE A COCINAR</title>
    <link rel="stylesheet" href="estilo-general2.css" type="text/css" media="all">
    <link rel="stylesheet" href="estilo-menu-desplegable2.css" type="text/css" media="all">
    <script language="javascript" src="no-tocar2.txt" type="text/javascript"></script>
    <script language="javascript" src="numero-de-menus2.txt" type="text/javascript"></script>
    </head>
    <body onload="init();">
    <div id="global">
    <div id="curva-superior"></div>
    <div id="cabecera">
    <div id="logotipo">
    [contenido no disponible]
    </div>




    <div id="publicidad">Bienvenidos a mi Web</div>
    </div>
    <div id="navegacion">
    <ul>
  • PRIMER PLATO
  • SEGUNDO PLATO
  • POSTRE

    </div>

    <div id="contenido">



    <h1 style="border : 0px ; text-align : center ; color: blue ; height:50px ; font: bold 25px Comic Sans MS, sans-serif">Aprende a cocinar de forma facil </h1>
    <div align="center">
    </div>


    <div id="menus-izquierda">


    <div id="menu">
    <div align="center"> <h1>PRODUCTOS</h1> </div>
    <ul>
  • VERDURAS
  • CARNE
  • PESCADO
  • ARROZ
  • DULCES
  • THERMOMIX
  • COCTELES
    </div>

    <div id="menu3">
    <div align="center"> <h1>INTERNACIONAL</h1> </div>
    <ul>
  • MEXICO
  • FRANCIA
  • DINAMARCA
  • SUIZA
    </div>
    </div>

    <div id="centro">
    <div id="texto">


    aqui todo el texto que quieras</p>


    aqui todo el texto que quieras</p>


    aqui todo el texto que quieras</p>
    </div>
    </div>

    <div id="menus-derecha">

    <div id="menu2">
    <div><h1>WEBS AFILIADAS</h1></div>
    <ul>
  • misclasesparticulares
  • Enlace 2
  • Enlace 3
  • Enlace 4
    </div>

    </div>





























    <div align="center">
    [contenido no disponible]
    </div>






    <div align="left">
    [contenido no disponible]


    </div>




























    </div>
    <div id="pie">
    <div id="pieuno">
    <ul>
  • Foro Ejemplo
  • Mi Libro de Visitas
  • Nos Enlazan

    </div>
    <div id="piedos">pie dos</div>
    <div id="pietres">
    <ul>
  • Directorio
  • TopSite
  • Mapa de la Web

    </div>
    </div>
    <div id="curva-inferior"></div>

    <script language="javascript" src="definir-menus2.txt" type="text/javascript"></script>
    </div>


    </body>

    </html>








    <script type="text/javascript" src="http://js-perso.ifrance.com/weborama.js"></script>
    <script language="Javascript" type="text/javascript">
    <!--
    document.write('<sc'+'ript src="http://js-perso.ifrance.com/js2.php?'+rnd+'"><'+'/sc'+'ript>');
    // -->
    </script>


    y el codigo fuente:

    * {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
    p {text-align: justify}
    h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ;
    text-align: center}
    h2 {font-size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ;
    text-align: center}
    body { background-color: #FFC0CB}
    #global {width:800px ; margin:4px auto }

    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repeat ;
    width: 800px ;
    height:12px ;
    overflow: hidden }
    #cabecera {background-color: white ; border-left: black 1px solid ;
    border-right: black 1px solid ; height:85px}
    #logotipo {width:280px ; float:left }
    #publicidad {width:518px ; float:right ; margin-top:25px ; font-size: 16px }
    #navegacion {background-color:#FF00FF ; border: black 1px solid ; height:20px}
    #navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px }
    #navegacion ul { margin-left: 180px }
    #contenido {background-color: #B0E2FF ; border-left: black 1px solid ;
    border-right: black 1px solid ; width:800px }
    #contenido p {margin: 5px 10px 0px 10px ; text-indent: 15px}
    #menu {
    background-color: #B0E2FF;
    width: 150px; height: 185px;
    float:none;
    text-align:left;
    margin: 0px 15px 0px 0px;
    background-image: url(objetos/menu-parte-inferior.gif);
    background-position: bottom;
    padding-bottom:5px;
    }
    #menu li {list-style:none ; margin: 4px 8px 4px 6px }
    #menu h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;
    background-image: url(objetos/menu-parte-superior.gif) }

    #menu2 {background-color: #9ACD32 ; width: 150px ; float:left ;
    text-align:center ; margin: 3px 20px 3px 3px ;
    background-image: url(objetos/menu-parte-inferior.gif);
    background-position: bottom ;
    padding-bottom:10px; height: 185px; display:inline}

    #menu2 h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;
    background-image: url(objetos/menu-parte-superior.gif)}

    #menu2 li {list-style:none ; margin: 4px 8px 4px 6px }

    #menu3 {background-color: #B0E2FF ; width: 150px ; float:left ;
    text-align:left ; margin: 3px 10px 15px 3px ;
    background-image: url(objetos/menu-parte-inferior.gif);
    background-position: bottom ;
    padding-bottom:5px ; display:inline}
    #menu3 li {list-style:none ; margin: 0px 0px 15px 0px }
    #menu3 h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;
    background-image: url(objetos/menu-parte-superior.gif) }

    #menus-derecha {float: right; width: 170px}
    #menus-izquierda {float:left; width: 170px}
    #centro {float: left; width: 450px}
    #menu1 {width:150px; float:left}
    #texto {
    width:400px;
    float: left;
    height: 200px;
    }






    #pie { border-left: black 1px solid ;border-right: black 1px solid ; border-top: black 1px solid ; height: 65px ;text-align: center ;background-color: #32CD32 ;}
    #pie li {list-style: none ; font-size: 12px }
    #pieuno {float:left ; width:150px }
    #piedos {float:left ; width:498px ; background-color: white}
    #pietres {float:right ; width:150px }


    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ;
    background-repeat: no-repeat ;
    width: 800px ;
    height:12px ;
    overflow: hidden }
    a {color: brown ; text-decoration:none ; display: inline }
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration:underline ; background-color: white}
    a:active {}

    #pie a {color: blue; text-decoration:none ; display: block }
    #pie a:link {}
    #pie a:visited {}
    #pie a:hover {color:black ; text-decoration:underline ; background-color: white }
    #pie a:active {color:black}

    #logotipo a {}
    #logotipo a:link {}
    #logotipo a:visited {}
    #logotipo a:hover {background-color: white }
    #logotipo a:active {}

    a.imagen {display: inline}