Foros del Web » Creando para Internet » CSS »

Problema color menu css en blog

Estas en el tema de Problema color menu css en blog en el foro de CSS en Foros del Web. Hola, le estoy añadiendo un menú al blog de mi hermana, pero no consigo hacer que aparezca una imagen que tengo alojada en imageshack cuando ...
  #1 (permalink)  
Antiguo 31/05/2011, 17:24
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 8 años, 3 meses
Puntos: 5
Problema color menu css en blog

Hola, le estoy añadiendo un menú al blog de mi hermana, pero no consigo hacer que aparezca una imagen que tengo alojada en imageshack cuando se pasa el cursor por el botón. No hay manera de quitar el color gris que aparece y ya le he dado mil vueltas, a ver si me podéis echar un cable.

El CSS es este:

Código:
<style type='text/css'>

.solidblockmenu{
margin: 0;
padding: 0;
float: left;
font: bold 13px Arial;
width: 100%;
overflow: hidden;
margin-bottom: 1em;
border: 1px solid #625e00;
border-width: 1px 0;
background: black url(http://img838.imageshack.us/img838/7158/menunegro.jpg) center center repeat-x;
}

.solidblockmenu li{
display: inline;
}

.solidblockmenu li a{
float: left;
color: white;
padding: 9px 11px;
text-decoration: none;
border-right: 1px solid white;
}

.solidblockmenu li a:visited{
color: white;
}

.solidblockmenu li a:hover, .solidblockmenu li .current{
color: white;
background: url(http://img801.imageshack.us/img801/6749/menurosa.jpg) center center repeat-x;
}

</style>
Y este el el html

Código:
<ul class="solidblockmenu">
<li><a href="http://www.bdebelleza.blogspot.com" title="">Inicio</a></li>
<li><a href="http://bdebelleza.blogspot.com/2010/06/sorteos.html" title="">Sorteos</a></li>
<li><a href="http://bdebelleza.blogspot.com/2010/06/premios.html" title="">Premios</a></li>
</ul>
<br style="clear: left"/>
  #2 (permalink)  
Antiguo 01/06/2011, 06:47
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 8 años, 3 meses
Puntos: 5
Respuesta: Problema color menu css en blog

Alguien me puede echar una mano? El blog en cuestión es este: www.bdebelleza.blogspot.com
  #3 (permalink)  
Antiguo 01/06/2011, 08:00
Avatar de Ventru3  
Fecha de Ingreso: noviembre-2010
Ubicación: Disneylandia
Mensajes: 86
Antigüedad: 6 años, 3 meses
Puntos: 13
Respuesta: Problema color menu css en blog

A mi si me funciona. Solo he reseteado el margin y el padding del html y el body y he añadido el wrapper para centrarlo y le he quitado un center que no hacia falta.

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
  4.  
  5.     <meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type">
  6.     <meta content="Beastak" name="Efbeezy">
  7. </head>
  8.  
  9.  
  10. <style type='text/css'>
  11.  
  12. html, body {
  13.     margin: 0px 0px 0px 0px;
  14.     padding: 0px 0px 0px 0px;
  15. }
  16.  
  17. .solidblockmenu{
  18. margin: 0;
  19. padding: 0;
  20. float: left;
  21. font: bold 13px Arial;
  22. width: 100%;
  23. overflow: hidden;
  24. margin-bottom: 1em;
  25. border: 1px solid #625e00;
  26. border-width: 1px 0;
  27. background: black url(http://img838.imageshack.us/img838/7158/menunegro.jpg) center repeat-x;
  28. }
  29.  
  30. #wrapper {
  31.     margin: 0px auto;
  32.     width: 600px;
  33. }
  34.  
  35. .solidblockmenu li{
  36. display: inline;
  37. }
  38.  
  39. .solidblockmenu li a{
  40. float: left;
  41. color: white;
  42. padding: 9px 11px;
  43. text-decoration: none;
  44. border-right: 1px solid white;
  45. }
  46.  
  47. .solidblockmenu li a:visited{
  48. color: white;
  49. }
  50.  
  51. .solidblockmenu li a:hover, .solidblockmenu li .current{
  52. color: white;
  53. background: url(http://img801.imageshack.us/img801/6749/menurosa.jpg) center repeat-x;
  54. }
  55.  
  56. <div id="wrapper">
  57.  
  58.     <ul class="solidblockmenu">
  59.         <li><a href="http://www.bdebelleza.blogspot.com" title="">Inicio</a></li>
  60.         <li><a href="http://bdebelleza.blogspot.com/2010/06/sorteos.html" title="">Sorteos</a></li>
  61.         <li><a href="http://bdebelleza.blogspot.com/2010/06/premios.html" title="">Premios</a></li>
  62.     </ul>
  63.  
  64. </div>
  65.  
  66. </body>
  67.  
  68. </html>
  #4 (permalink)  
Antiguo 01/06/2011, 08:35
 
Fecha de Ingreso: abril-2011
Mensajes: 1.342
Antigüedad: 5 años, 10 meses
Puntos: 344
Respuesta: Problema color menu css en blog

Tienes otra regla css que se superpone a la regla que utilizas para poner la imagen.

La regla que se superpone es la siguiente:

Código CSS:
Ver original
  1. .tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
  2.   background: none repeat-x scroll 0 -100px #444444;
  3.   color: #FFFFFF;
  4. }

Revisa la css con el validador de la w3c ya de paso.
  #5 (permalink)  
Antiguo 01/06/2011, 08:59
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 8 años, 3 meses
Puntos: 5
Respuesta: Problema color menu css en blog

Hola, muchisimas gracias por responder. He modificado el código y sigue sin salirme, he probado con Firefox, Chrome y Explorer y nada, sigue saliendo el color #141414 en el botón cuando paso el cursor.

Incluso he probado a poner otro menú que he encontrado en una página de recursos copiandolo entero y sale todo bien excepto el color #141414 que parece que no hay manera de quitarlo...
  #6 (permalink)  
Antiguo 01/06/2011, 09:02
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 8 años, 3 meses
Puntos: 5
Respuesta: Problema color menu css en blog

Cita:
Iniciado por alexg88 Ver Mensaje
Tienes otra regla css que se superpone a la regla que utilizas para poner la imagen.

La regla que se superpone es la siguiente:

Código CSS:
Ver original
  1. .tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
  2.   background: none repeat-x scroll 0 -100px #444444;
  3.   color: #FFFFFF;
  4. }

Revisa la css con el validador de la w3c ya de paso.
Muchas gracias! He borrado esa regla y ahora si que funciona, uff me estaba ya volviendo loco... jejej
Ahora mismo me pongo también a revisar la css con el validador. Muchas gracias a todos! un saludo.

Última edición por kahlo84; 01/06/2011 a las 09:10
  #7 (permalink)  
Antiguo 13/11/2011, 10:15
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 8 años, 3 meses
Puntos: 5
Respuesta: Problema color menu css en blog

Vuelvo a este post de hace un tiempo porque vuelvo a tener un problema con el mismo menú. La cosa es que he ido añadiendo categorías y ahora se me ha quedado algo pequeño.

Estoy probando con el código y quitando el overflow si lo veo más grande (más de lo que me gustaría) pero sale muy a la derecha.

Cómo podría hacer para ajustarlo al ancho del blog? Llevo ya tiempo con esto y me estoy volviendo loco :S

Muchísimas gracias por vuestro tiempo, un saludo!
  #8 (permalink)  
Antiguo 15/11/2011, 05:35
 
Fecha de Ingreso: noviembre-2009
Mensajes: 41
Antigüedad: 7 años, 3 meses
Puntos: 10
Respuesta: Problema color menu css en blog

Cambia el width actual por el que necesites:

Código:
.tabs-outer {
    display: block !important;
    margin: 0 auto;
    position: relative;
    width: 900px;
}
  #9 (permalink)  
Antiguo 15/11/2011, 10:58
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 8 años, 3 meses
Puntos: 5
Respuesta: Problema color menu css en blog

Muchas gracias por tu respuesta, con ese código he conseguido que salga el menú entero, pero por más que modficio los 900px al menú no se le cambia el tamaño, y tampoco puedo alinearlo ni centrarlo :S

Un saludo!

Etiquetas: blog, color
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 18:25.