Entrar

Alineacion en menus horizontales.

Alfredo Flores · · Solicitar retirada
Cree un menu vertical segun las instrucciones de CCW. Tengo una lista de varios elementos dentro de un div. Quiero hacer que un elemento aparezca en dos renglones. Esto lo hize experimentando un poco y logre que se viera bien en explorer pero no en firefox. Tambien me gustaria poder centrar los otros elementos de la lista para que todo quede centrado verticalmente. Que el que ocupa doble espacio ocupe todo lo alto y los otros esten en medio.

Muchas Gracias.
Alfredo Flores · · Solicitar retirada
Este es el contenido de el index.


<html>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<head>
<title>Page title</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabezera">
<div id="logotipo"><a href="http://www.gmail.com">
[contenido no disponible]
</a></div>
<div id="lateral">CONSTRUCCION CON ESTILO</div>
</div>
<div id="navegacion">
<ul>
  • Quienes somos
  • Casas en Venta
  • Proyectos
  • Curriculum de trabajadores

    </div>
    <div id="contenido">
    <div id="menu">
    <h1>Proyecto</h1>
    <ul>
  • San Mateo
  • Satellite
  • Decoracion
  • Diseno
  • Construccion
    </div>
    <h1>DECORACION DISENO Y CONSTRUCCION</h1>


    TEXTO </p>
    <h2>Nomas Probando


    MAS TEXTO.</p>


    MAS MAS TEXTO </p></h2>
    </div>
    <div id="pie"> Pie de Pagina</div>
    <div id="curva-inferior"></div>
    </div>
    </body>
    </html>

    Y ESTE ES EL CONTENIDO DE LA HOJA DE ESTILOS.

    body{text-align:center; background-image:url(objetos/fondo.gif);}
    *{margin:0px; padding:0px; border:0px}
    p{text-align:justify}
    h1{font-size:2em; color:blue;font-weight:bold;text-decoration:underline;text-align:center}
    h2{font-size:1.5em; color:blue; font-weight:bold; text-decoration:none; text-align:center}
    #global{width:1000px; margin:4px auto}
    #cabezera{
    background-color:white;
    text-align:center;
    border-right:black 1px solid;
    border-left:black 1px solid;
    height:310px
    }
    #logotipo {background-color: brown ; width:350px ; float:left; margin-left:5px; padding:20px}
    #lateral {
    background-color: white;
    font-size:3em;
    width:600px;
    float:right;
    margin-top:5px;
    background-image: url(objetos/casa.GIF);
    background-repeat: no-repeat;
    background-position: center center;
    height: 300px;
    }
    #navegacion{
    background-color:#CCCCCC;
    border:black 1px solid;
    height:50px
    }
    #navegacion ul{margin-left:100px; margin-top:10px}
    #navegacion li{
    font-size:1.2em;
    list-style:none;
    float:left;
    margin:0px 30px 0px 30px;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-style: italic;
    color: #D4D0C8;
    font-weight: bold;
    font-variant: normal;
    }
    #navegacion a{color:blue; text-decoration:none; display:block;}
    #navegacion a:link{}
    #navegacion a:visited{}
    #navegacion a:hover{color:white; text-decoration:underline; background-color:blue}
    #navegacion a:active{}
    #contenido{
    background-color:#C1CDD7;
    border-left:black 1px solid;
    border-right:black 1px solid;
    }
    #contenido p{text-align:justify; padding:10px 10px 5px 10px; text-indent:20px}
    #menu{width:200px; float:left; text-align:left; margin:5px 10px 10px 5px;background-image: url(objetos/menu-parte-inferior.gif); background-position:bottom; }
    #menu li{font-size:1.2em; list-style:none; margin:10px 4px 4px 4px;padding-left:10px}
    #menu h1 {text-decoration:none ; font-size:20px; padding-top:12px ; background-image: url(objetos/menu-curva-superior.gif);background-repeat: no-repeat}
    #menu a{clor:brown; text-decoration:none; display:block;}
    #menu a:link{}
    #menu a:visited{}
    #menu a:hover{color:red; text-decoration:underline; background-color:gray}
    #menu a:active{}
    #pie{background-color:white; border-top:black 1px solid; border-right:black 1px solid;border-left:black 1px solid;}
    #curva-superior{background-image: url(objetos/curva-superior.gif); background-repeat: no-repeat; width:1000px; height:12px; overflow:hidden;}
    #curva-inferior{background-image: url(objetos/curva-inferior.gif); background-repeat: no repeat; width:1000px; height:12px; overflow:hidden;}


    MUCHAS GRACIAS