[HTML4/PHP/CSS 2] Créer des bordures

Résolu
Linukcs Messages postés 80 Date d'inscription   Statut Membre Dernière intervention   -  
Linukcs Messages postés 80 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

J'ai un petit souci avec mon bout de code CSS.

J'ai pour mission de faire un affichage graphique de mes hyperliens avec :
-> Une bordure gauche
-> Un fond de la largeur du texte
-> Une bordure droite.

Les spécifications de mes images sont:
-> Bordure gauche : 20x10, ne doit pas se répéter.
-> Fond : 20x1, se répétant sur la longueur du texte.
-> Bordure droite : 20x10, ne doit pas se répéter.

Voici le code de la partie gênante du site (index.php) incluse dans les balises <BODY>: 

[...]   
<TD>   
  <span class="nailleft"><span class="nailright"><span class="nail"><span class="nailtext">   
   <a href="index.php?onglet=presentation">Présentation</a>   
  </span></span></span></span>   
 </TD>   
 <TD>   
  <span class="nailleft"><span class="nailright"><span class="nail"><span class="nailtext">   
   <a href="index.php?onglet=metiers">Métiers</a>   
  </span></span></span></span>   
 </TD>   
[...]


et voici le contenu de mon CSS 
span.nailtext   
{   
 margin-left:10px;   
 margin-right:10px;   
 width:auto;   
}   

span.nail   
{   
 background-image : url("img/nail_bg.png");   
 background-position: center;   
}   

span.nailleft   
{   
 width:10px;   
 background-image : url("img/nail_gb.png");   
 background-repeat : no-repeat;   
 background-position : left;   
}   

span.nailright   
{   
 background-image : url("img/nail_db.png");   
 background-repeat : no-repeat;   
 background-position : right;   
}


Comme vous pourrez le constater dans les screenshots, je peux afficher le fond de mon hyperlien, mais je ne vois pas les bordures de mon onglet.

1 - Est-ce tout simplement impossible ?
2 - Sachant que j'utilise le PHP, est-ce que je peux faire cette manipulation ?

ci-joint le Screenshot de mon site :

http://linukcs.net/img/Onglet.jpg

Et ceux de mes hyperliens : bg pour le fond, gb pour la gauche et db pour la droite

http://linukcs.net/img/nail_bg.png
http://linukcs.net/img/nail_db.png
http://linukcs.net/img/nail_gb.png

Merci d'avance de vos réponses ;)

<config>Windows 7 / Firefox 12.0</config>

N'oubliez pas le bouton '+' si la réponse vous a aidé !
A voir également:

2 réponses

Réponse 1 / 2
katsuo49 Messages postés 330 Date d'inscription   Statut Membre Dernière intervention   25
 
Pourquoi ne pas simplement utiliser un tableau ?
Pour chaque onglet tu crées une ligne (à passer en inline en css pour les avoir en ligne) et dans chaque ligne trois cellules, avec un border-collpse ça devrait passer non ? à moins que tu es absolument besoin que cela soit fais avec des span ?
1
Réponse 2 / 2
Linukcs Messages postés 80 Date d'inscription   Statut Membre Dernière intervention   14
 
Re,

Ah oui, pas bête.
Dans ce cas, je vais en profiter pour faire l'automatisation de mes onglets avec un XML et un PHP.

Merci beaucoup !
0