hola de nuevo,
como dije en anteriores mensajes, estoy rehaciendo la web que tenia casi preparada.
de una web me he bajado la estructura de un menu horizontal desplegable y hay una cosilla que se me escapa:
- dimensión (ancho) de cada uno de los temas: el apartado "arquitecto de la semana" me aparece en 2 lineas y quiero que sea en una sola, distribuyendo los espacios entre el resto de los elementos. No se si deberia separar cada apartado por un div y darle el tamaño que yo quiero o si de esta manera se puede resolver.
el codigo es:
----------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>MEDBEN-Arquitectura: La web del Arquitecto.</title>
<META content="Web de Xavier Medina dedicada a los estudiantes de arquitectura por su contenido docente y de ayuda para la carrera. De la misma manera, hay un apartado dedicado a presentar los proyectos realizados durante la misma." name="description">
<META content="xavier, medina, benhamú, arquitectura, arquitecto, proyectos, estudios, ETSAB, badalona" name="keywords">
<link rel="stylesheet" type="text/css" href="menuheader.css" />
<script type="text/javascript" src="menuheader.js"></script>
</head>
<body>
<div id="global">
<div id="logotipo">[contenido no disponible]
</div>
<div id="data">
<SCRIPT>
<!--
dows = new Array("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sábado");
months = new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");
now = new Date();
dow = now.getDay();
d = now.getDate();
m = now.getMonth();
h = now.getTime();
y = now.getYear();
document.write(dows+" "+d+" de "+months+" de "+y);
//-->
</SCRIPT>
</div>
<div id="main">
<div id="header">
<ul id="nav">
PORTADA
<ul>
Presentación
Novedades
Mapa del Sitio
Concursos
Foro MEDBEN
Acerca de...
NOTICIAS
<ul>
Nacional
Internacional
Materiales
Sistemas
Normativas
ARQUITECTO DE LA SEMANA
<ul>
Biografia
Obras realizadas
Galeria imágenes
Comentarios
Bibliografia
SOFTWARE
<ul>
Bloques 2D
Bloques 3D
Texturas
Utilidades
Enlaces
VIAJES
<ul>
Europa
Asia
África
América
Oceania
CURRICULUM
<ul>
Primero
Segundo
Tercero
Cuarto
Quinto
Proyecto PFC
</div>
</div>
</div>
</body>
</html>
------------------------------------------------------------------------
y la hoja de estilos:
------------------------------------------------------------------------
body{margin:0;padding:0; text-align:center; background-color:;}
* {text-indent:0px ;margin: 0px; padding: 0px; border: 0px}
#global {WIDTH: 800px; margin:4px auto }
#logotipo {width:800px; float: center; margin:10px 0px 10px 0px; border: green 1px solid}
#data {text-align:right; font-weight:bold; font-size:0.6em; font-family: Arial,Verdana,Helvetica,Sans-serif; margin:10px 0px 10px 0px;}
#main{width:800px; position:absolute; margin-left:-370px; left:470px; /* posición del nav */ text-align:center;}
#header{ width:100%;background:url(header3.jpg) no-repeat; height:150px;}
/* ------------- Menú de Navegación -------------------------- */
#nav{margin:0;position:absolute;top:10px;right:40px; /*margen con el div */}
#nav li{color:white; /*color base del texto*/float:left;width:11em;margin:0;padding:0;list-style:none;background:transparent;font:11px Verdana,Tahoma,Helvetica,Sans-serif;text-align:center;position:relative;cursor:default;}
#nav li ul{padding-top:7px; /* referente a la parte superior */ margin:0;}
#nav a{text-decoration:none;}
#nav li a{color:white; font-weight: bold;}
#nav li a:hover{text-decoration:underline;}
#nav li li a:hover{text-decoration:none;}
#nav li li{filter:Alpha(opacity=50,finishopacity=50,style=1);/* Transparencia en Internet Explorer */}
#nav li li a{ border-color: white; border-style:solid; border-width:0 2px 1px 2px; display:block; color:#000000; font-weight: bold;background:transparent url(nav.png) 0px 0px repeat scroll; line-height:18px;}
#nav li li a:hover{color:white;background:transparent url(navhover.png) 0px 0px repeat scroll;/* Transparencia en Otros navegadores */}
li ul{padding:0.5em 0 1em 0;display:none;position:absolute;top:100%;left:0;}
li>ul{top:auto;left:auto;}
li li{float:left;border:0;display:block;background:transparent;}
li:hover ul,li.over ul{display:block;}
----------------------------------------------------------------------------------
gracias!
como dije en anteriores mensajes, estoy rehaciendo la web que tenia casi preparada.
de una web me he bajado la estructura de un menu horizontal desplegable y hay una cosilla que se me escapa:
- dimensión (ancho) de cada uno de los temas: el apartado "arquitecto de la semana" me aparece en 2 lineas y quiero que sea en una sola, distribuyendo los espacios entre el resto de los elementos. No se si deberia separar cada apartado por un div y darle el tamaño que yo quiero o si de esta manera se puede resolver.
el codigo es:
----------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>MEDBEN-Arquitectura: La web del Arquitecto.</title>
<META content="Web de Xavier Medina dedicada a los estudiantes de arquitectura por su contenido docente y de ayuda para la carrera. De la misma manera, hay un apartado dedicado a presentar los proyectos realizados durante la misma." name="description">
<META content="xavier, medina, benhamú, arquitectura, arquitecto, proyectos, estudios, ETSAB, badalona" name="keywords">
<link rel="stylesheet" type="text/css" href="menuheader.css" />
<script type="text/javascript" src="menuheader.js"></script>
</head>
<body>
<div id="global">
<div id="logotipo">[contenido no disponible]
</div>
<div id="data">
<SCRIPT>
<!--
dows = new Array("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sábado");
months = new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");
now = new Date();
dow = now.getDay();
d = now.getDate();
m = now.getMonth();
h = now.getTime();
y = now.getYear();
document.write(dows+" "+d+" de "+months+" de "+y);
//-->
</SCRIPT>
</div>
<div id="main">
<div id="header">
<ul id="nav">
<ul>
<ul>
<ul>
<ul>
<ul>
<ul>
</div>
</div>
</div>
</body>
</html>
------------------------------------------------------------------------
y la hoja de estilos:
------------------------------------------------------------------------
body{margin:0;padding:0; text-align:center; background-color:;}
* {text-indent:0px ;margin: 0px; padding: 0px; border: 0px}
#global {WIDTH: 800px; margin:4px auto }
#logotipo {width:800px; float: center; margin:10px 0px 10px 0px; border: green 1px solid}
#data {text-align:right; font-weight:bold; font-size:0.6em; font-family: Arial,Verdana,Helvetica,Sans-serif; margin:10px 0px 10px 0px;}
#main{width:800px; position:absolute; margin-left:-370px; left:470px; /* posición del nav */ text-align:center;}
#header{ width:100%;background:url(header3.jpg) no-repeat; height:150px;}
/* ------------- Menú de Navegación -------------------------- */
#nav{margin:0;position:absolute;top:10px;right:40px; /*margen con el div */}
#nav li{color:white; /*color base del texto*/float:left;width:11em;margin:0;padding:0;list-style:none;background:transparent;font:11px Verdana,Tahoma,Helvetica,Sans-serif;text-align:center;position:relative;cursor:default;}
#nav li ul{padding-top:7px; /* referente a la parte superior */ margin:0;}
#nav a{text-decoration:none;}
#nav li a{color:white; font-weight: bold;}
#nav li a:hover{text-decoration:underline;}
#nav li li a:hover{text-decoration:none;}
#nav li li{filter:Alpha(opacity=50,finishopacity=50,style=1);/* Transparencia en Internet Explorer */}
#nav li li a{ border-color: white; border-style:solid; border-width:0 2px 1px 2px; display:block; color:#000000; font-weight: bold;background:transparent url(nav.png) 0px 0px repeat scroll; line-height:18px;}
#nav li li a:hover{color:white;background:transparent url(navhover.png) 0px 0px repeat scroll;/* Transparencia en Otros navegadores */}
li ul{padding:0.5em 0 1em 0;display:none;position:absolute;top:100%;left:0;}
li>ul{top:auto;left:auto;}
li li{float:left;border:0;display:block;background:transparent;}
li:hover ul,li.over ul{display:block;}
----------------------------------------------------------------------------------
gracias!