[html/css]Problèmes barre rapide [Réglé]
Aligner du texte et agrandir des images
Créations de Thèmes
Kak Miortvi Pengvin Membre non connecté
-
Booster Missile
- Voir le profil du membre Kak Miortvi Pengvin
- Inscrit le : 10/03/2006
- Site internet
Je suis en train de préparer une barre rapide pour mon site.
Mais il me reste encore deux problèmes.
- le compteur de visites journalières n'est pas correctement aligné avec le reste et je n'arrive pas à trouver comment faire.
- le fond bleu, qui apparait lors du passage de la souris sur les liens de gauche, n'est pas complet (il manque quelques pixels que je n'arruuve pas à afficher).
Voici le code html de cette partie (header.tpl).
Code :
# START compteur #
<div id="sub_header">
<div id="sub_header_left">
[img]../templates/aquablue/images/sub_header_l.png[/img]
[img]../templates/aquablue/images/pomme.png[/img]
<a href="../index/index.php" title="News" class="button"> Accueil </a><a href="../forum/index.php" title="Forum" class="button"> Forum </a><a href="../livredor/livredor.php" title="Livre d'or" class="button"> Livre d'or </a><a href="../pages/partenaires.php" title="Partenaires" class="button"> Partenaires </a>
</div>
<div id="sub_header_right">
{L_TODAY}: {compteur.COMPTEUR_DAY}
[img]../templates/aquablue/images/recherche.png[/img]
[img]../templates/aquablue/images/sub_header_r.png[/img]
</div>
</div>
# END compteur #Et le css correspondant.
Code :
/* Sub header */
#sub_header{
height: 20px;
width: auto;
background: url(images/barre1.png) repeat-x;
margin-top: 2px;
margin-bottom: 3px;
}
#sub_header_left{
height: 20px;
width: auto;
background: url(images/sub_header_l.png) no-repeat;
float: left;
}
#sub_header_right{
height: 20px;
width: auto;
float: right;
}
/* Rollover des boutons de la speed barre */
a.button
{
color: #000000;
height: 20px;
width: auto;
text-decoration: none;
text-align: center;
vertical-align: top;
line-height: 20px;
}
a:hover.button
{
color: #FFFFFF;
height: 20px;
width: auto;
background: url(images/barre2.png) repeat-x center;
text-decoration: none;
text-align: center;
vertical-align: top;
line-height: 20px;
}Dernière chose, je travaille sur un thème dérivé de "Aquablue".
Merci de votre aide.
KMP.
CrowkaiT Membre non connecté
-
Modérateur
- Voir le profil du membre CrowkaiT
- Inscrit le : 17/06/2005
- Site internet
- Groupes :
-
Equipe Historique
[code]# START compteur #
<div id="sub_header">
<div id="sub_header_left">
<img src="../templates/aquablue/images/sub_header_l.png" alt="" />
<img src="../templates/aquablue/images/pomme.png" alt="" />
<a href="../index/index.php" title="News" class="button"> Accueil </a><a href="../forum/index.php" title="Forum" class="button"> Forum </a><a href="../livredor/livredor.php" title="Livre d'or" class="button"> Livre d'or </a><a href="../pages/partenaires.php" title="Partenaires" class="button"> Partenaires </a>
</div>
<div id="sub_header_right">
<div class="button">{L_TODAY}: {compteur.COMPTEUR_DAY}</div>
<img src="../templates/aquablue/images/recherche.png" alt="" />
<img src="../templates/aquablue/images/sub_header_r.png" alt="" />
</div>
</div>
# END compteur #[/code]
Pour la deuxième: essaye en augmentant le padding sur la classe :hover
Kak Miortvi Pengvin Membre non connecté
-
Booster Missile
- Voir le profil du membre Kak Miortvi Pengvin
- Inscrit le : 10/03/2006
- Site internet
- Ce n'est pas super efficace... Si après modifications, le texte est bien aligné, les deux images de la fin partent "en vrille" et se retrouvent en dessous du texte qui se termine au dernier pixel de la barre. J'ai essayé aussi ce code mais sans résultat.
[code]<div id="sub_header_right">
<div class="button">{L_TODAY}: {compteur.COMPTEUR_DAY}
<img src="../templates/aquablue/images/recherche.png" alt="" />
<img src="../templates/aquablue/images/sub_header_r.png" alt="" />
</div>
</div> [/code]
- Là c'est bon, ça marche. Mais comme je suis casse pied, j'aimerai corriger un détail. Lorsque je passe la souris sur la barre et sur un bouton, les "cases" s'élargissent par rapport à leur taille "normale" (comme lorsque la souris est dans une news par exemple). J'aimerai que la taille soit fixe.
CrowkaiT Membre non connecté
-
Modérateur
- Voir le profil du membre CrowkaiT
- Inscrit le : 17/06/2005
- Site internet
- Groupes :
-
Equipe Historique
Kak Miortvi Pengvin Membre non connecté
-
Booster Missile
- Voir le profil du membre Kak Miortvi Pengvin
- Inscrit le : 10/03/2006
- Site internet
Répondre
Vous n'êtes pas autorisé à écrire dans cette catégorie