Menu CSS horizontal fijo

angelez · #1 (**permalink**) 15/03/2010, 04:19

Hola.

Bueno la cuestion es que quiero hacer un menu conCSS en horizontal, para ello he mirado un tutorial para hacerlo con lista, y me funciona bien, el problema es que cuando se redimensiona la ventana, haciendola mas estrecha, el menu se descoloca y se ponen unos debajo de otros.

El ejemplo es este:

http://www.csslab.cl/ejemplos/menu_list.html

a ver si me dais alguna idea, gracias

JavierB · #2 (**permalink**) 15/03/2010, 07:01

Hola angelez

Muevo tu tema al foro de CSS desde Web general.

Saludos,

Impostor · #3 (**permalink**) 15/03/2010, 07:45

Buenas,

si quieres que tu menu se adapte a la ventana debes maquetarla con unidades relativas (em).

Saludos¡¡

angelez · #4 (**permalink**) 15/03/2010, 12:25

Me imagino que te refieres a las unidades en el estilo CSS.

Lo he cambiado y no funciona, sigue moviéndose:
www.telefonica.net/web2/lascosasdeangel/menu.html

gracias

Carlangueitor · #5 (**permalink**) 15/03/2010, 12:30

Lo que tienes que hacer es poner el menú con una medida fija.

Saludos

Impostor · #6 (**permalink**) 15/03/2010, 12:40

Buenas,

he visto el código de tu web y se me ha quedado esta cara

. Tienes estilos añadidos directamente en linea, usas tablas para la maquetación, y aunque usas medidas relativas, tienes el body al 80% de widt, deberias cambiarlo. Ah, y añade al css lo siguiente

* {
margin:0;
padding:0;
outline:0;
}

No te solventara tu duda, pero es muy aconsejable.

Mira, esta guía te ayudara a dejar las tablas para maquetar. También mira este ejemplo, es un menu centrado sencillo, que no se descolaca al redimensionar la ventana.

Saludos¡¡

gachon · #7 (**permalink**) 15/03/2010, 14:03

Cita:

Iniciado por Impostor

* {
margin:0;
padding:0;
outline:0;
}

Perdona Importor ese asterico con el codigo css lo he visto en muchas web que he destripado para ir aprendiendo css, pero todavia no se para que es???
Deberia ponerselo a la Web que estoy haciendo?
que funcion tiene?
saludos y muchas gracias

jomaruro · #8 (**permalink**) 15/03/2010, 15:34

Hola:

El asterisco es conocido como selector universal, esto quiere decir que todas las propiedades que se le den a este selector se aplican a todos los elementos de la página en cuestión. Ponerlo así es útil para resetear los valores por defecto que aplican los distintos navegadores a algunos elementos.

Saludos.

gachon · #9 (**permalink**) 15/03/2010, 16:01

muchas gracias, por la aclaracion jomaruro

angelez · #10 (**permalink**) 16/03/2010, 01:04

Cita:

Iniciado por Impostor

Buenas,

he visto el código de tu web y se me ha quedado esta cara

. Tienes estilos añadidos directamente en linea, usas tablas para la maquetación, y aunque usas medidas relativas, tienes el body al 80% de widt, deberias cambiarlo. Ah, y añade al css lo siguiente

Tienes razón, tengo que intentar hacer la página con DIV, pero eso llegará mas adelante, porque en Kompozer (que es el editor que uso) no se manejan muy bien los DIV.

En cuanto a los estilos CSS estan dentro de la página solo para probar, la idea es ponerla externa cuando sea definitiva.

Primero quiero apender a hacer el menú con CSS y que no se mueva cuando se redimensiona.

El manual es muy bueno, me lo estudiaré.