[Résolu]Afficher alphabet sur une ligne

Bonjour,

Je voudrais afficher l'alphabet sur une ligne entière, l'utilisateur cliquant sur la lettre correspondant aux personnes commençant à celle-ci.

Malheureusement, après application du CSS, les lettres restent toujours collées les unes aux autres, sans aucune mise en page spéciale.

La page :

echo '<p id="alphabet">';
	//Affichage des caractères		
	for ($i=ord('A'); $i <= ord('Z'); $i++) 
	{ 
		echo '<a href="index.php?nomlien=gest_client&Lettre=' . chr($i) . '" title="' . chr($i) . '" >' . chr($i). '</a>'; 
	} 
echo '</p>';

Le CSS :

p #alphabet
{
	margin: auto;
}

p #alphabet a
{
	text-decoration : none;
	font-size: 18px;
	padding-right: 20px;
}

p #alphabet a:hover  
{
        color: red; 
}

Merci pour votre aide.
Modifié par Killaman (28 Nov 2008 - 14:10)

p #alphabet a {
letter-spacing:5px;
}

Si je me gourre pas pour les espaces de gauche à droite c'est "letter-spacing"

Merci de ta réponse.

Le souci, c'est que les propriétés affichées ne s'appliquent pas. Je pense que mes balises ne sont pas bonnes, mais je ne vois pas pourquoi...

Sûrement un truc tellement bête que ça me saute pas aux yeux.

Bonjour,

Le padding marche. Mais tes sélecteurs sont faux, ils ne sélectionnent absolument rien.

Pour rappel, le sélecteur p #alphabet a se lit ainsi: «sélectionne tout élément A enfant ou descendant d'un élément qui porte l'identifiant "alphabet", lui-même enfant ou descendant d'un élément P».
Modifié par Florent V. (27 Nov 2008 - 12:01)

Donc, si j'ai bien compris, il faut que je sélectionne seulement sur #alphabet a.

Mais ça ne fonctionne toujours pas.

Est-ce nécessaire que j'inclue mon id="alphabet" dans <p ...> ... </p> ?

J'ai tenté le <div id="alphabet">...</div> et le <span id="alphabet">...</span> (pas sûr du type d'élément à entourer de balises...) mais ça ne change pas non plus.

Killaman a écrit :
Donc, si j'ai bien compris, il faut que je sélectionne seulement sur #alphabet a.

Oui, ou p#alphabet a, mais pas p #alphabet a.

Killaman a écrit :
Mais ça ne fonctionne toujours pas.

C'est censé marcher. Soit tu as mal mis à jour ton CSS, commis une autre erreur quelque part, ou bien tu as une erreur de syntaxe HTML quelque part, ou bien... difficile à dire dans l'absolu. La page HTML est valide? Le code CSS également?

Merci pour ton aide.

Je n'ai pas validé ma page, mais mis à part le bout de code donné en 1er poste, tout le reste est tel que je le souhaite, sans aucune erreur visible.

Donc, je pensais vraiment à un problème d'appel des attributs CSS par la balise "<p id="alphabet">".
Graphiquement, je souhaiterai étendre sur la largeur totale de mon bloc les lettres de l'alphabet, avec un espace égal entre chaque, des liens sur ces lettres pointant vers une requête SQL me permettant d'afficher les personnes commençant par la lettre sélectionnée. Je ne veux pas afficher le trait caractéristique des liens, et augmenter la taille de la police...

Si tu le souhaites, je peux te copier le contenu total de ma page et du CSS, mais ça fait 650 lignes...

Bonjour,

si tu veux être certain qu'un sélecteur CSS a un effet quelque part sur ta page, rajoute l'instruction:

selecteur {
instruction1: 45px;
instruction2: 1.6;
[b]background-color: pink;[/b]
}

et si tu ne vois pas de rose sous ton paragraphe, il y a un souci. Ou bien tu utilises l'extension Firebug et il faudrait que ton bloc d'instruction soit visible sur l'élément HTML prévu ... mais le rose est plus spectaculaire (fonctionne aussi avec lightgreen, yellow, ...)

Bon, c'est incompréhensible...

J'arrive ce matin sur le PC, je lance mon EasyPHP, me connecte sur la page où j'avais le problème... Et là, ça fonctionne...

Alors je me dis que je vais continuer ma modif... La modif ne se fait pas

Ça viendrait ptete d'EasyPHP en fin de compte...

EDIT : background-color: pink; ne me fait rien du tout...
Modifié par Killaman (28 Nov 2008 - 11:21)

Bon en fin de compte, la modification ne se fait que lorsque je recharge la page, c'est étrange...

M'enfin, merci à tous, c'est résolu.

Killaman a écrit :
Bon en fin de compte, la modification ne se fait que lorsque je recharge la page

Euh oui, ça s'appelle le Web.