Foros del Web » Creando para Internet » CSS »

centrar menu

Estas en el tema de centrar menu en el foro de CSS en Foros del Web. hola tengo un menu Código: <div id="botonera"> <div id="botonera_sombra"> <div id="botonera_contenido"> <ul id="menu"> <li><a href="pisos.asp" >pisos</a></li> <li><a href="casas.asp" >casas</a></li> <li><a href="promociones.asp" >promociones</a></li> <li><a href="terrenos.asp" >terrenos ...
  #1 (permalink)  
Antiguo 01/08/2009, 04:22
Avatar de engonga  
Fecha de Ingreso: marzo-2002
Ubicación: Córdoba
Mensajes: 1.299
Antigüedad: 15 años, 9 meses
Puntos: 8
centrar menu

hola tengo un menu


Código:
 
<div id="botonera">
 <div id="botonera_sombra">
       <div id="botonera_contenido">
       <ul id="menu">
  <li><a href="pisos.asp" >pisos</a></li>
  <li><a href="casas.asp" >casas</a></li>
  <li><a href="promociones.asp" >promociones</a></li>
  <li><a href="terrenos.asp" >terrenos - solares - bordas</a></li>
  <li><a href="locales.asp" >locales</a></li>
  <li><a href="alquiler.asp" >alquiler</a></li>
  
</ul>
       </div>
    </div>
</div>

y los css

Código HTML:
ul#menu
{
 margin:0;
 padding:0;
 list-style-type:none;
 width:auto;
 position:relative;
 display:block;
 height:30px;
 font-size:12px;
 font-weight:bold;
 background:transparent url(../imatges/nav_bg2.jpg) repeat-x top left;
 font-family:Arial, Helvetica, sans-serif;
 border-bottom:1px solid #000000;
 border-top:1px solid #000000;
}
ul#menu li
{
 display:block;
 float:left;
 margin:0;
 padding:0;
}
 
ul#menu li a
{
 display:block;
 float:left;
 color:#000000;
 text-decoration:none;
 font-weight:bold;
 padding:8px 20px 0 20px;
}
 
ul#menu li a:hover
{ 
 color:#777703;
 height:22px;
 background:transparent url(../imatges/nav_bg2.jpg) 0px -30px no-repeat;  
}
 
#menu .menuseleccionat{
 display:block;
 float:left;
 margin:0;
 padding:0;
 color:#777703;
 height:22px;
 background:transparent url(../imatges/nav_bg2.jpg) 0px -30px no-repeat;
 text-decoration:none;
 font-weight:bold;
 padding:8px 20px 0 20px;
}
ul#menu li a.current
{
 display:inline;
 height:22px;
 background:transparent url(../imatges/nav_bg.jpg) 0px -30px no-repeat; 
 float:left;
 margin:0;
}
 
 
/*-------------------------------------------------------------*/
#botonera {
 background-color:#f9f90b;
 width:100%;
 text-align:left;
}
#botonera_sombra{
 margin-left:auto;
 margin-right:auto; 
 background-image:url(../imatges/fons_sombres.png);
 background-repeat:repeat-y;
 background-position:top;
 width:958px;
 height:32px;
 
 
 }
#botonera_contenido{
 
 width:  948px;  /*1-para opera*/ 
 \width: 958px; /*2-para ie-se agrega el padding y border*/ 
 w\idth: 948px; /*3- estandares*/
 
 
 height:32px;
 margin-left:5px;
 background:#f9f90b;
 
 
 
 
 
}
 
y no puedo centrar el menu

alguien me puede echar una mano?
__________________
joan blanch
  #2 (permalink)  
Antiguo 01/08/2009, 04:35
Avatar de MasterXNicoX  
Fecha de Ingreso: junio-2008
Ubicación: ../Arg/SanLuis.city
Mensajes: 943
Antigüedad: 9 años, 6 meses
Puntos: 28
Respuesta: centrar menu

Holass!!!

Cita:
#botonera_contenido{

width: 948px; /*1-para opera*/
\width: 958px; /*2-para ie-se agrega el padding y border*/
w\idth: 948px; /*3- estandares*/
NO SABIA QUE ESA PROPIEDAD EXISTIA
__________________
Adivino del Foro y Admirador de Sabios
  #3 (permalink)  
Antiguo 01/08/2009, 04:42
Avatar de MasterXNicoX  
Fecha de Ingreso: junio-2008
Ubicación: ../Arg/SanLuis.city
Mensajes: 943
Antigüedad: 9 años, 6 meses
Puntos: 28
Respuesta: centrar menu

En cuanto a lo de centrar fijate si haciendo esto te funciona...

Al principio del css poné: *{margin:0px;padding:0px;outline:none}

y....

HTML:

Cita:
<div id="botonera">
<div id="botoneracentrada>
<div id="botonera_sombra">
<div id="botonera_contenido">
<ul id="menu">
<li><a href="pisos.asp" >pisos</a></li>
<li><a href="casas.asp" >casas</a></li>
<li><a href="promociones.asp" >promociones</a></li>
<li><a href="terrenos.asp" >terrenos - solares - bordas</a></li>
<li><a href="locales.asp" >locales</a></li>
<li><a href="alquiler.asp" >alquiler</a></li>

</ul>
</div>
</div>
</div>
</div>
CSS:

Cita:

/*-------------------------------------------------------------*/
#botonera {
background-color:#f9f90b;
width:100%;
text-align:left;
}

#botoneracentrada{left:0px;right:0px}

#botonera_sombra{
margin-left:auto;
margin-right:auto;
background-image:url(../imatges/fons_sombres.png);
background-repeat:repeat-y;
background-position:top;
width:958px;
height:32px;


}
#botonera_contenido{

width: 948px; /*1-para opera*/
\width: 958px; /*2-para ie-se agrega el padding y border*/
\width: 948px; /*3- estandares*/


height:32px;
margin-left:5px;
background:#f9f90b;





}

Y tendrias que ponerles a las capas "position:absolute"...


También podrias pasarte por este tema, el usuario kseso? explica como centrar en css

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

Saludos y espero que te sirva
__________________
Adivino del Foro y Admirador de Sabios

Última edición por MasterXNicoX; 01/08/2009 a las 04:49 Razón: Gramática xD
  #4 (permalink)  
Antiguo 01/08/2009, 04:52
Avatar de engonga  
Fecha de Ingreso: marzo-2002
Ubicación: Córdoba
Mensajes: 1.299
Antigüedad: 15 años, 9 meses
Puntos: 8
Respuesta: centrar menu

no funciona!!!
__________________
joan blanch
  #5 (permalink)  
Antiguo 01/08/2009, 04:55
Avatar de engonga  
Fecha de Ingreso: marzo-2002
Ubicación: Córdoba
Mensajes: 1.299
Antigüedad: 15 años, 9 meses
Puntos: 8
Respuesta: centrar menu

el menu lo genere con esto

http://www.cssmenumaker.com/
__________________
joan blanch
  #6 (permalink)  
Antiguo 01/08/2009, 04:56
Avatar de MasterXNicoX  
Fecha de Ingreso: junio-2008
Ubicación: ../Arg/SanLuis.city
Mensajes: 943
Antigüedad: 9 años, 6 meses
Puntos: 28
Respuesta: centrar menu

Podrías mostrarme un ejemplo de lo que estás buscando hacer???
__________________
Adivino del Foro y Admirador de Sabios
  #7 (permalink)  
Antiguo 01/08/2009, 04:56
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: centrar menu

Prueba esto:
Código css:
Ver original
  1. ul#menu {
  2. background:transparent url(../imatges/nav_bg2.jpg) repeat-x left top;
  3. border-bottom:1px solid #000000;
  4. border-top:1px solid #000000;
  5. font-family:Arial,Helvetica,sans-serif;
  6. font-size:12px;
  7. font-weight:bold;
  8. height:30px;
  9. list-style-type:none;
  10. margin:0 auto;
  11. padding:0;
  12. position:relative;
  13. text-align:center;
  14. width:620px;
  15. }
  16.  
  17. ul#menu li {
  18.  float:left;
  19.  margin:0;
  20.  padding:0;
  21. }
  22.  
  23. ul#menu li a {
  24.  display:block;
  25.  color:#000000;
  26.  text-decoration:none;
  27.  font-weight:bold;
  28.  padding:8px 20px 0 20px;
  29. }
Quizás tengas que cambiar alguna anchura más de las cajas contenedoras en las que utilizas imágenes de fondo para mantener los efectos.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #8 (permalink)  
Antiguo 01/08/2009, 05:10
Avatar de engonga  
Fecha de Ingreso: marzo-2002
Ubicación: Córdoba
Mensajes: 1.299
Antigüedad: 15 años, 9 meses
Puntos: 8
Respuesta: centrar menu

funcionó con la solucion de Keso?


gracias
__________________
joan blanch
  #9 (permalink)  
Antiguo 01/08/2009, 05:29
Avatar de MasterXNicoX  
Fecha de Ingreso: junio-2008
Ubicación: ../Arg/SanLuis.city
Mensajes: 943
Antigüedad: 9 años, 6 meses
Puntos: 28
Respuesta: centrar menu

:-p
__________________
Adivino del Foro y Admirador de Sabios
  #10 (permalink)  
Antiguo 01/08/2009, 05:42
Avatar de engonga  
Fecha de Ingreso: marzo-2002
Ubicación: Córdoba
Mensajes: 1.299
Antigüedad: 15 años, 9 meses
Puntos: 8
Respuesta: centrar menu

gracias tambien a ti MasterXNicoX


__________________
joan blanch
  #11 (permalink)  
Antiguo 01/08/2009, 05:44
Avatar de MasterXNicoX  
Fecha de Ingreso: junio-2008
Ubicación: ../Arg/SanLuis.city
Mensajes: 943
Antigüedad: 9 años, 6 meses
Puntos: 28
Respuesta: centrar menu

Jajajajaja xD Mi intensión estuvo
__________________
Adivino del Foro y Admirador de Sabios
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 11:17.