problema con ancho de un menu de navegacion

[heinzy]

Hola mi problema es el siguiente

Tengo una barra de navegacion q no soy capaz de conseguir q tenga el mismo ancho en diferentes monitores con diferentes resoluciones.
pero solo el lado derecho ya que el izquierdo va perfecto. he probado creo q casi todo y no hay manera.

el enlace para q lo veais en la web

es la barra de en medio encima de la galeria de fotos q pone ramos,centros etc..

http://www.flowerpower.es/serviciosramosycentros/serviciosramos.html#pie


aqui les dejo el archivo css


/* barra superior menu fotos ramos y centros*/
#chromemenu1{
position: relative;
overflow:hidden;
top: -20px;
left: 15px;
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana;
z-index:15;
width: 520px;
}

/* tamaño del cuadro del texto ¨*/

#chromemenu1 ul{
border: 1px solid #BBB;
background-color: white;
padding: 5px 0px;
margin: 0 ;
}

#chromemenu1 ul li{
display: inline;
margin-left: -3px;
padding-left: 0px;

text-align: left; /*set value to "right" for example to align menu to the left of page*/

}

#chromemenu1 ul li a{
color: #666;
padding: 5px;
text-decoration: none;
border-right: 1px solid #DADADA;
}

#chromemenu1 ul li a:hover{
background-color: #ff66d0;
color: white;
}

#chromemenu1 ul li.pulsado3 a { background-color: #ff66d0; color:white;}




alguna sugerencia gracias por la ayuda ;)

[heinzy]

[heinzy]

porfavor q alguien me ayude

[joseoliveras]

En principio estás usando una fuente (Lucida) que varía bastante entre navegadores, de hecho no está entre las Web Safe Fonts.

Por otro lado hacer menús que se "justifiquen" a ambos lados no es tarea fácil, como solución rápida yo asignaría una clase al último ítem del menú y le daría el valor del ancho hasta que ajustara, de todas formas en algunos navegadores no se ajustará al final y en otros te saltará una línea, por lo que necesitarás hacer un ajuste algo diferente para cada navegador, sinceramente, yo buscaría una solución alternativa.

[heinzy]

Hola jose!



lo de la fuente tienes toda la razon no me di cuenta. por lo demas tienes razon pero pensaba que seria mas facil ajustarlo,
si pongo position:absolute; y width:auto; se ajusta perfecto lo que pasa q el menu entero sale en una parte diferente de la pagina en resoluciones diferentes.
pero solo se mueve ese menu los demas se quedan en su posicion perfectamente.

como deberia ser el position en esta pagina absolute o relative?

alguna sugerencia para una solucion alternativa?

Muchas gracias por tu respuesta! ;)

[joseoliveras]

Es una cuestión de matemáticas.

Tienes un contenedor del menú que ocupa un 100%, entonces si tienes cuatro menús cada uno de ellos debe ocupar el 25%, no puedes tener diferentes tamaños de botón si lo que quieres es ajustar el menú al 100% del contenedor.

En mi blog hice un post que igual te sirve como orientación, aunque habla de un menú centrado los cálculos vendrían a ser los mismos.

http://www.joseoliveras.es/menu-centrado-horizontal/

[heinzy]

hola jose he mirado tu blog y he visto lo q querias decir.

pero como me dijistes antes en el otro mensaje anterior quizas poniendo una clase al ultimo boton pudiera corregir ese error,
pero como lo hago? alguna idea?
es q soy muy cabezon y quiero creer q hay alguna manera de hacerlo.
gracias de nuevo

[joseoliveras]

Si este es el menu

Código HTML:

<ul>
<li class="pulsado3"><a href="serviciosramos.html#pie">Ramos</a></li>
<li><a href="servicioscentros.html#pie4">Centros</a></li>
<li><a href="servicioscestasyflores.html#pie5">Cestas de flores y plantas </a></li>
<li><a href="serviciosplantasnaturales.html#pie6">Plantas naturales</a></li>
<li class="last"><a href="serviciosplantasartificiales.html#pie7">Plantas artificiales</a></li>
</ul>
 

Al útlimo li le das una clase y puedes eliminarle la barra del final.

Código CSS:

.last{border-right:none;}