Bouton--onglets css-html

jjaco -  
jjaco Messages postés 575 Statut Membre -
Bonjour,
je viens de creer avec photofiltre des boutons (jolis)

1ère question si je met le texte, il s'affiche en haut du bouton, si je fais <br>, il se met en bas.
il faudrait un 1/2<br> pour qu'il reste au centre, mais je ne sais pas comment faire...

2ème question, j'aimerais que le lien se fasse avec le bouton et pas avec le texte.ou dois-je placer <a href>?

div#menu1{
float:left;
width:150px;
height:60px;
background-image:url(bouton.jpg);
background-repeat:no-repeat;
}

<div id="menu">
<div id="menu1"><h3><font color=white><font face ="comic sans ms">menu</font></h></div>
A voir également:

4 réponses

Gihef Messages postés 5165 Statut Contributeur 2 779
 
Bonjour,

Quand on utilise des CSS, on évite
<font color=white><font face ="comic sans ms">menu</font>
et d'utiliser des balises sémantiques (mal refermée “</h3>”) pour de la mise en forme
<h3>…</h>
<hn> c'est pour les titres, pas pour autre chose.

Il serait plus simple d'avoir
div#menu1 { 
  float:left; 
  width:150px; 
  height:60px; 
  background-image:url(bouton.jpg); 
  background-repeat:no-repeat; 
  font-family:"comic sans ms";
  color : #fff;
  font-size : --em;  /* une taille qui te plaît */
  } 
et donc
<div id="menu1">menu</div>
Plus clair, non ?
Tu vas placer chaque élément du menu dans une <div> avec une id différente ?


Pour tes problèmes, tu peux t'y prendre autrement.
NOTE : Ton code est incomplet, alors ça risque de ne pas s'adater à ton contexte.

L'alignement vertical dans tes blocs peut s'obtenir en définissant une “line-height” de la même taille que la “height”.

Le lien ne peut se faire qu'avec un <a>. Texte ou image.
Alors, la solution est de placer l'image en background du <a> pas de la <div>.
Encore faut-il qu'il y ait un <a>…
Et de définir un “display : block;” et des dimensions correspondantes au <a>.


++
Merci de penser à utiliser le bouton indiqué.

Tu trouveras un exemple ici fait avec une liste <ul> plutôt que dans une <div>. Ça peut se faire de la même façon.
Comme tu n'évoques pas d'effet au survol par la souris, tu peux te passer de ce qui concerne le “:hover” et le “:active”.


--
1
dudu134 Messages postés 2877 Statut Membre 608
 
Bonjour,
< a href=" "> menu< /a>

0
jjaco Messages postés 575 Statut Membre 45
 
ok merci
ça je savais, le problème est de faire le lien avec le bouton et non avec le texte puisque le bouton est en css et le texte en html
0
jjaco Messages postés 575 Statut Membre 45
 
merci, mais j'ai pas compris grand-chose...
la nuit porte conseil et demain j'étudie <ul> <li> <a> etc...
merci, je reviendrai
0