Centrar una barra de menú horizontal de espionaje Lee Margolies - 11/05/2009
Estoy tratando de un centro horizontal de barra de menú de espionaje en una página. Por alguna razón, es decir,, FF y Safari son todos justificar el menú de la izquierda y si no tienen una propiedad relleno (ver más abajo) en la UL.Menubarhorizontal desplaza la barra entera alrededor de 20 píxeles a la derecha.
Cualquier ayuda que puede ofrecer es apreciado...
Thanx,
LM
/ * El recipiente exterior de la barra de menú, De una caja automática de ancho sin margen o material de relleno * /
UL.Menubarhorizontal
{
Margen: 0;
Padding: 0;
Anchura: 666px;
}
/ * Establecer la barra de menú activo con esta clase de, ActuaLMente ajuste Z-index para dar cabida a errores de representación es decir,: http:/ / therealcrisp.XS4ALL.Nl / Meuk / es-zindexbug.html * /
UL.Menubaractive
{
Z-index: 1000;
}
/ Contenedores elemento de menú *, Los niños posición con respecto a este contenedor y un ancho fijo * /
UL.Li menubarhorizontal
{
List-style-type: Ninguno;
Font-size: 100%;
Posición: Relativa;
Line-Altura: -15;
Cursor: Pointer;
Anchura: 133.2px;
Flotador: Izquierda;
}
Submenús * / deben aparecer debajo de su padre (arriba: 0) con un mayor Z-index, Pero son iniciaLMente hacia el lado izquierdo de la pantalla (-1000em) * /
UL.Ul menubarhorizontal
{
Margen: 0;
Padding: 0;
List-style-type: Ninguno;
Font-size: 100%;
Z-index: 1020;
Cursor: Por defecto;
Izquierdo: -1000em;
Anchura: 160px;
Posición: Absoluta;
Background-Color: # 005dab;
Color: # fff;
}
/ * Submenú que se muestra con la designación de la clase menubarsubmenuvisible, Nos pusimos a la izquierda en auto para que lo que se refiere a la pantalla por debajo de su elemento primario del menú * /
UL.Ul menubarhorizontal.Menubarsubmenuvisible
{
Izquierdo: Automático;
}
/ * Elemento de menú de los contenedores son los mismos de ancho fijo como padre * /
UL.Menubarhorizontal UL li
{
Font-family: Arial, Helvetica, Sans-serif;
Font-size: 12px;
Font-weight: Normal;
Anchura: 160px;
Border-Anchura: 1px 2px 1px 2px;
Border-style: Sólidos;
Border-Color: # 005dab;
Background-Color: Transparente;
Flotador: Ninguno;
Margen: 0 0 0 -1.5%;
}
/ * Submenú que se muestra con la designación de la clase menubarsubmenuvisible, Nos pusimos a 0 a la izquierda por lo que viene en la pantalla * /
UL.Ul menubarhorizontal.Ul menubarsubmenuvisible.Menubarsubmenuvisible
{
Izquierdo: Automático;
Superior: 0;
}
/ * Opciones del menú son un bloque de Color gris claro con el relleno y ningún tipo de decoración de texto * /
UL.Menubarhorizontal un
{
Exponer: Bloque;
Cursor: Pointer;
Background-Color: # fff;
Padding: 0.5em 0.75em;
Color: # 005dab;
Text-decoration: Ninguno;
Text-align: Centro;
}
/ Menu items * que han ratón sobre o enfoque tiene un fondo azUL y texto en blanco * /
UL.Menubarhorizontal un:Hover, UL.Menubarhorizontal un:Enfoque
{
Background-Color: # 005dab;
Color: # fff;
}
UL.Menubarhorizontal UL (
Text-align: Izquierda;
}
/ * Opciones del menú que se abre con submenús se establecen en menubaritemHover con un fondo azUL y texto en blanco * /
UL.Menubarhorizontal un.MenubaritemHover, UL.Menubarhorizontal un.MenubaritemsubmenuHover, UL.Menubarhorizontal un.Menubarsubmenuvisible
{
Text-decoration: Ninguno
}
/ * Hack para ie: Para estabilizar la apariencia de los elementos de menú, la barra de flotación es mantener es decir, 5.0 de analizar * /
@ pantalla de los medios de comunicación, Proyección
{
UL.Li menubarhorizontal.Menubaritemie
{
Exponer: Inline;
F \ loat: Izquierda;
}
}
Volver: Centrar una barra de menú horizontal de espionaje Fernando Mol - 11-06-2009
Que usted necesita para jugar con el ancho de.
Ahora, De toda la anchura de su menú no se divide en el número de elementos de menú que se han. Recordar, Las pantallas de las medidas en píxeles.
Cambiar el ancho de la columna central (donde usted tiene su menú están instalados) y convertirlo en un ancho que puede ser dividido en 5, El número de elementos de menú que se han. Entonces, Jugar con el ancho de los elementos de lista y las fronteras para ajustarlo.
Espero que esta ayuda
* Recuerde que compartir un enlace a su sitio y al tipo de puestos de. Este es un servicio gratuito para usted y para nosotros.
Volver: Centrar una barra de menú horizontal de espionaje Lee Margolies - 11-06-2009
Gracias por la ayuda...
Traté de ajustar el ancho y todavía sale demasiado pequeño o demasiado larga. Desde el Spry se anida en una etiqueta div (navbar), Debo sólo ajustar el ancho de DIV a un múltiplo de 5 o tengo que ir más arriba en la cadena de?
Gracias de nuevo!
LM
Margolies Lee
http://www.Lmcreativemotion.com
Twitter: @ LMcreativemotio
Volver: Centrar una barra de menú horizontal de espionaje Fernando Mol - 11-07-2009
Su menú está dentro de un contenedor de. Que contenedor debe ser dividido por 5 a un número cuadrado.
Que es el número que debe dar a la anchura de cada elemento de menú. Teniendo en cuenta boders.
Yo no estoy diciendo exactamente dónde poner los números, Pero es un proceso de ensayo y error de, Pero espero que la idea.
Seguir esta regla también: El número divisible debe ser un par.
* Recuerde que compartir un enlace a su sitio y al tipo de puestos de. Este es un servicio gratuito para usted y para nosotros.
