Foros del Web » Creando para Internet » CSS »

espacio izquierdo en lista horizontal

Estas en el tema de espacio izquierdo en lista horizontal en el foro de CSS en Foros del Web. buenas noches, trato de personalizar un menú, y por muchas vueltas que le doy, hay una pequeña cosa, que no logro solucionar, cuando centro los ...
  #1 (permalink)  
Antiguo 31/10/2013, 14:01
 
Fecha de Ingreso: julio-2002
Mensajes: 813
Antigüedad: 16 años
Puntos: 2
espacio izquierdo en lista horizontal

buenas noches,

trato de personalizar un menú, y por muchas vueltas que le doy, hay una pequeña cosa, que no logro solucionar, cuando centro los elementos de la lista horizontalmente eliminando #menuhore li {float:left}, al cambiar el fondo de cada elemento con #menuhore a:hover hay un pequeño margen a la izquierda, de manera que no se cubre de border a border,

lo he revisado unas cuantas veces, y no lo veo, este es el código css, el código html es simplemente una lista ul con sus correspondientes elementos li para las opciones del menu:

Código CSS:
Ver original
  1. #menuhore {
  2.      height: 40px;
  3.      width: auto;
  4.      margin: 0px auto;
  5.      text-align: center;
  6.      background: #455868;
  7.      font-size: 11pt;
  8.      font-family: Capriola, Arial, sans-serif;
  9.      font-weight: normal;
  10.      position: relative;
  11.      border: 2px solid #455868;
  12.      border-radius: 5px;
  13. }
  14.  
  15. #menuhore ul {
  16.      padding: 0px;
  17.      margin: 0px auto;
  18.      width: auto;
  19.      height: 40px;
  20. }
  21.  
  22. #menuhore li {
  23.      display: inline;
  24.      float: left;
  25. }
  26.  
  27. #menuhore a {
  28.      color: #fff;
  29.      display: inline-block;
  30.      width: auto;
  31.      padding:0px 10px;
  32.      text-align: center;
  33.      text-decoration: none;
  34.      line-height: 40px;
  35. }
  36.  
  37. #menuhore li a {
  38.      border-right: 1px solid #576979;
  39.      box-sizing:border-box;
  40. }
  41.  
  42. #menuhore li:last-child a {
  43.      border-right: 0;
  44. }
  45.  
  46. #menuhore a:hover, #menuhore a:active {
  47.      background-color: #8c99a4;
  48. }
  49.  
  50. #menuhore .active a {
  51.      background-color: #8c99a4;
  52.      cursor: default;
  53. }
  54.            
  55. #menuhore a#pull {
  56.      display: none;
  57. }

gracias.
  #2 (permalink)  
Antiguo 01/11/2013, 16:33
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 9 años, 5 meses
Puntos: 306
Respuesta: espacio izquierdo en lista horizontal

Faltaría el html o un enlace para poder reproducir el error que dices.
Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #3 (permalink)  
Antiguo 01/11/2013, 17:31
 
Fecha de Ingreso: julio-2002
Mensajes: 813
Antigüedad: 16 años
Puntos: 2
Respuesta: espacio izquierdo en lista horizontal

Código HTML:
Ver original
  1. <div id="menuhore" class="menuclear">
  2.     <ul class="menuclear">
  3.         <li id="id1"><a href="">Opción 1</a></li>
  4.         <li id="id2"><a href="">Opción 2</a></li>
  5.         <li id="id3"><a href="">Opción 3</a></li>
  6.         <li id="id4"><a href="">Opción 4</a></li>
  7.         <li id="id5"><a href="">Opción 5</a></li>
  8.         <li id="id6"><a href="">Opción 6</a></li>
  9.         <li id="id7"><a href="">Opción 7</a></li>
  10.     </ul>
  11.     <a href="#" id="pull">Menú</a>
  12. </div>
  #4 (permalink)  
Antiguo 01/11/2013, 18:25
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 9 años, 5 meses
Puntos: 306
Respuesta: espacio izquierdo en lista horizontal

Bueno evoarte, creo que este articulo seguro te servirá para adoptar alguna solución a tu problema:

http://ksesocss.blogspot.com/2012/03...empeno-en.html

Como verás hay varias alternativas, aunque no todas funcionan en todos los navegadores, así que verás que haces.

Podrías probar de centrar de otra forma, y para ello nada mejor que este otro articulo:
http://ksesocss.blogspot.com/2012/05...6-maneras.html

Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--

Etiquetas: background, color, espacio, horizontal, hover, html, lista
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 14:24.