OVH Cloud OVH Cloud

Style dans un lien

1 réponse
Avatar
Téo Path
Bonjour,

Un peu à la fois j'avance en php et je me retrouve confronté à un problème de style.

Ma page :

http://www.osteo-59.do-annu.com/annuaire.php?reket=0

Pas la peine de jouer avec les liens, la grande majorité ne mène nulle part.

Ma feuille de style :

http://www.do-annu.com/doannu/bin/style.css

Mon problème :

Les liens bleus qui figurent dans le corps de la page, laissent apparaitre : les nom,
prénom et ville.

Dans des ordres différents selon que le tri s'effectue par ville ou par ordre
amphabétique.

J'aimerais formater le texte sur 2 colonnes, nom et prénom d'un coté et ville de l'autre.

j'ai défini 2 sous classes :

.listelien {
width: 530px; margin: auto; list-style: none; text-align: left;
font-size: 0.8em; padding: 0px; padding-top: 160px;
}
.listelien LI {
padding: 0px; margin: 0px;
}
.listelien A {
border-bottom: 2px solid; border-right: 2px solid; border-top: 1px solid; border-left:
1px solid;
border-color: #1AF #13B #13B #1AF;
display: block; font-family: Arial, sans-serif; font-weight: bold; padding-left: 10px;
padding-right: 10px;
width: 100%; color: white; line-height: 2.1em; background-color: #17F;
text-decoration: none
}
.listelien A gauche {
text-decoration: underline;
}
.listelien A droite {
margin-right: 0px;
}

Cà ne perturbe pas l'affichage, mais çà n'a pas l'air non plus de beaucoup l'inflencer.

Sur un site entièrement en CSS çà m'embêterai de devoir intéger des tableaux dans mes
liens ou des espaces.

Quelqu'un a t'il une idée ?

D'avance merci.

--
Teo Path
http://www.hourdeaux.fr.st

1 réponse

Avatar
ASM
Téo Path a écrit :
Bonjour,

Un peu à la fois j'avance en php et je me retrouve confronté à un
problème de style.

Ma page :

http://www.osteo-59.do-annu.com/annuaire.php?reket=0



alors au lieu de :
<li><a href="#">
<gauche>DUnkerque</gauche>
<droite>LELEU&nbsp;Xavier</droite>
<span>

avec des balises gauche et droite qui n'existent pas en html
si tu faisais :

<li><a href="#">DUnkerque<tt>LELEU Xavier</tt><span>

avec :
.listelien { }
.listelien li { display: block; }
.listelien a { display: block; padding-left: 30px; width: 100%; }
.listelien a tt { white-space: no-wrap; float: right;
margin-right: 30px; font-family: times;}

pour éviter les 'DUnkerque' tu sais que tu as des fonctions php pour
gérer minuscules et majuscules ?


autre soluce qui marchera peut-être celle là :

<li><a href="#"><tt>DUnkerque</tt>LELEU Xavier<span>

avec :
.listelien { width: 80%; }
.listelien li { display: block; liste-style: none; padding:0;margin:0;}
.listelien a { display: block; width: 100%; margin: 2px;
text-align: right; padding-right: 40px; }
.listelien a tt { white-space: no-wrap;
float: left; margin-left: 20px;
font-family: times; }
.listelien a span { display:none; }

--
Stephane Moriaux et son [moins] vieux Mac