📣 Seu anúncio aqui? Anuncie no ForoBeta

Ajuda com menu vertical: Problema ao passar o mouse por cima de opções do menu

  • Autor Autor Xanina
  • Data de início Data de início
Tradução em andamento: em alguns minutos este tópico estará em português. Por enquanto, o conteúdo está no original em espanhol. Ver original
X

Xanina

Beta
Usuário com poucas negociações! Use sempre o saldo do ForoBeta!
aquí está mi web:
Tere Rico

le he puesto un menú vertical a la izquierda y al pasar con el ratón por encima de las opciones del menú (li:hover), en las opciones que pone el texto en dos líneas, me queda mal

uff... no sé si son las horas, pero veo que me estoy explicando muy mal :s

resumiendo, pasando con el ratón por encima de la sección del menu "preguntas frecuentes" ¿veis como queda mal lo que configuré con el hover?
creo que debe de ser una tontería, pero no se me ocurre cómo solucionarlo... ¿alguien me sabría ayudar??

muchas gracias por anticipado 🙂
 
Foi útil? Participe da conversa

Com sua conta grátis você pode responder, mandar mensagem privada ao autor e comprar com Saldo retido: o pagamento é liberado quando você recebe o combinado.

Continuar com o Google Criar conta com e-mail
Leva 30 segundos · você volta a este tópico ao terminar
A eso te refieres, si es eso, quitale el background o agregale un height

 
kanikase disse:
A eso te refieres, si es eso, quitale el background o agregale un height

Clique para expandir...

sí, es eso :encouragement:, pero no le quiero quitar el background, pq quiero que marque las opciones así al pasar por encima... y ponerle un height.. he probado y no veo ningún cambio
¿dónde le tendría que poner el height? yo se lo he probado en
Inserir CODE, HTML ou PHP: 
nav ul li a:hover { height: 50px; }
y no veo que haga nada distinto

el problema es que lo trata como si fueran dos líneas, dos opciones de menú, y realmente es una sóla opcion que va en dos líneas por el tamaño del texto
 
Xanina disse:
sí, es eso :encouragement:, pero no le quiero quitar el background, pq quiero que marque las opciones así al pasar por encima... y ponerle un height.. he probado y no veo ningún cambio
¿dónde le tendría que poner el height? yo se lo he probado en
Inserir CODE, HTML ou PHP: 
nav ul li a:hover { height: 50px; }
y no veo que haga nada distinto

el problema es que lo trata como si fueran dos líneas, dos opciones de menú, y realmente es una sóla opcion que va en dos líneas por el tamaño del texto
Clique para expandir...

Intenta con un float:left
Si eso funciona, y al ul quitale el margin-bottom:30px;

 
Última edição:
kanikase disse:
Intenta con un float:left
Si eso funciona, y al ul quitale el margin-bottom:30px;

Clique para expandir...

uff, cierto!! con el float left arreglas el problema de "preguntas frecuentes" pero desmadras todo el menú al pasar con el ratón por encima ¿has comprobado lo que hace ahora? :ambivalence:

lo del margin del ul... ¿a que se debe?

gracias por tu interés :encouragement:
 
Xanina disse:
uff, cierto!! con el float left arreglas el problema de "preguntas frecuentes" pero desmadras todo el menú al pasar con el ratón por encima ¿has comprobado lo que hace ahora? :ambivalence:

lo del margin del ul... ¿a que se debe?

gracias por tu interés :encouragement:
Clique para expandir...

No te entendí :welcoming:
 
kanikase disse:
No te entendí :welcoming:
Clique para expandir...

después de poner el float:left; pasa el ratón por encima de las opciones de menú, sobre todo por encima de la opción de "blog" y verás lo que hace :ambivalence:

gracias de nuevo por estar ahí
 
Hola, prueba con display: block

HTML: 
nav ul li a:hover, nav ul ul.acordeon li:hover {
  background: rgba(22,70,136,1);
  padding: 5px 10px;
  color: pink;
  display: block;
}
 
display: block;

lo mas fácil!
 
Tenemos este css
Inserir CODE, HTML ou PHP: 
nav ul li a, nav ul li label { 
    font-family: kavoon; 
    font-size: 1.1em;
    color: rgba(22,70,136,1); 
    /*text-transform: uppercase;*/
} 
nav ul li a:hover, nav ul ul.acordeon li:hover {
    background: rgba(22,70,136,1);
    padding: 5px 10px;
    color: pink;
}

Prueba reemplazándolo por este
Inserir CODE, HTML ou PHP: 
nav ul li a, nav ul li label { 
	font-family: kavoon; 
	font-size: 1.1em; 
	display:block; 
	padding: 3px 5px;
	color: rgba(22,70,136,1); 
	/*text-transform: uppercase;*/
} 
nav ul li a:hover, nav ul ul.acordeon li:hover {
	background: rgba(22,70,136,1);
	color: pink;
}

Saludos 🙂
 
perfecto!! entre unos y otros lo habéis conseguido!! YA ESTÁ SOLUCIONADO!!! :encouragement:😛8:😛8:😛8:

la respuesta de OLMID no dejó lugar a dudas :encouragement:

muchas gracias a todos !!
 
Você precisa estar logado ou cadastrado para responder aqui.
Voltar
Topo