centrar menu

[engonga]

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?

[MasterXNicoX]

Holass!!!

#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

[MasterXNicoX]

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:

<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:

/*-------------------------------------------------------------*/
#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

[engonga]

no funciona!!!

[engonga]

el menu lo genere con esto

http://www.cssmenumaker.com/

[MasterXNicoX]

Podrías mostrarme un ejemplo de lo que estás buscando hacer???

[kseso?]

Prueba esto:

Código css:

ul#menu {
background:transparent url(../imatges/nav_bg2.jpg) repeat-x left top;
border-bottom:1px solid #000000;
border-top:1px solid #000000;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:bold;
height:30px;
list-style-type:none;
margin:0 auto;
padding:0;
position:relative;
text-align:center;
width:620px;
}
 
ul#menu li {
 float:left;
 margin:0;
 padding:0;
}
 
ul#menu li a {
 display:block;
 color:#000000;
 text-decoration:none;
 font-weight:bold;
 padding:8px 20px 0 20px;
}
 

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

[engonga]

funcionó con la solucion de Keso?


gracias

[MasterXNicoX]

:-p

[engonga]

gracias tambien a ti MasterXNicoX

[MasterXNicoX]

Jajajajaja xD Mi intensión estuvo