Bouton sur deux lignes

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Bouton sur deux lignes

Skaym

Bonjour à tous,

Je débute en html et je suis confronté a un petit problème pour ma navigation.

Je voudrais que chacun de mes liens comprenne un titre, et un petit texte explicatif, comme sur l'image ci dessous :

Je voudrais qu'en le survolant le texte "un bouton" devienne vert clair et le sous titre "qui ne marche pas du tout" passe en blanc.
Mais je voudrais que ca reste un seul lien, je veux dire si on survole "un bouton", que le sous titre change lui aussi de couleur.

J'ai pas mal tourné sur le net je n'arrive pas à trouver de réponse satisfaisante

Voilà ou j'en suis (c'est un extrait bien sûr), mais ca marche pas du tout, je comprends pas comment dire a mon lien qu'il contient deux éléments qui doivent changer pour deux couleurs differentes

Un bout de code

Code :

<ul class="menu">
<li><a href="#">Un Bouton<br /><span class="boutons">Qui ne marche pas du tout</span></a></li>
<li><a href="#">Dépannage</a></li>
<li><a href="#">Formation</a></li>
<li><a href="#">Contact</a>
</ul>

Un bout de CSS

Code :

.menu {
float: inside;
display: block;
padding-right: 50px;
padding-left: 50px;
}
nav.primary ul li {
display: inline;
float: inside;
position: relative;
}
nav.primary ul li a {
display: inline-block;
line-height: 15px;
padding: 0 30px;
color: #ebebeb;
text-transform: none;
text-decoration: none;
font-weight: bold;
letter-spacing: 0.08em;
}
nav.primary ul li a:hover {
cursor: pointer;
color: #ff6a00
}
nav.primary ul li a span:hover {
cursor: pointer;
color: Aquamarine
}

Je vous remercie par avance, et si par hasard une réponse valable a ma problématique avait déjà été postée et m'avait échappée je vous serais très reconnaissant de me l'indiquer.

Publicité

gelatine_velue

La soluce ici: http://jsfiddle.net/85MMz/

Une remarque: tu as posté du css qui ne correspond pas au html, j'ai du rajouter des balises. Ca aide pas pour comprendre.
Une autre remarque: j'ai testé que sous firefox.

Message édité par gelatine_velue le 11-01-2013 à 15:02:50

Skaym

Salut Gelatine!

Merci beaucoup pour ton aide ça répond tout à fait à ce que je cherchais, et finalement c'est simple quand on a la solution sous les yeux ^^

Désolé pour les balises manquantes j'ai oublié que j'avais fait des tests ratés, je ferais gaffe si prochaine fois il y a.

Merci encore et au plaisir!

FORUM HardWare.fr

Programmation

HTML/CSS

Bouton sur deux lignes

Sujets relatifs
Création d'un tableau html (lignes + colonnes) avec mysql	[API] utilisation bouton fait Segfault le programme
AS3 Simple swap de CLip/Bouton	Batch afficher les 10 derniers caractères de chaques lignes
Visual C++ 2010 - Lancer un batch dos depuis un bouton	[VBA]Calcul du nombre de lignes avec 3 conditions non numériques
[IDE] Sauts de lignes ftp	afficher le texte d'un bouton sur plusieurs lignes
bouton SUBMIT : texte sur 2 lignes !	est-il possible de faire un bouton sur 2 lignes avec CSS2 ?
Plus de sujets relatifs à : Bouton sur deux lignes

Page générée en 0.055 secondes