Retour à la ligne avec retrait positif

Bonjour à toutes et à tous,

Je suis stagiaire dans une petite entreprise, ma mission est de remettre à niveau et rafraîchir le site Internet.
Actuellement le site datant de 2001 est réalisé en tableaux et iframes.

J'ai décidé de le passer en XHTML Strict 1.0 et CSS.

Dans quelques pages, je génère grâce à PHP/MySQL, une liste (j'utilise donc <ul></ul>) de document que l'internaute peut télécharger.
Parfois, le titre du document étant assez long il se positionne sur deux lignes.

Voici un screenshot :



Comme vous le voyez, le titre revient à la ligne de manière classique. Or je souhaiterai qu'il revienne au niveau de la ligne rouge, pour que tout soit aligné correctement. Comme un retrait positif (ce n'est peut-être pas le bon terme).

J'ai regardé toutes les propriétés CSS, et je n'en ai pas trouvé une qui pourrait m'aider. Si ça se trouve je suis passé à côté.

Avez-vous une idée ?
Dois-je absolument passer en tableau ?

Voici ma ligne de code :

echo "<li>"; printf("%02d", $jour); echo "/"; printf("%02d", $mois); echo "/$annee : <a href=\"http://localhost:8888/acanthe/acan/fr/communiques/$annee/$lien.pdf\">$nom</a></li>";

Salut,

un <dl> <dt> <dd> serait plus propice à mon avis.

Bonjour,

Sur le site pompage.net il y a tout un article sur les listes de définitions :

a écrit :
Avant d'opter pour une liste de définitions, soyez bien conscient que ce n'est pas forcément toujours le meilleur choix dans tous les cas.

Le <dt> ne peut pas contenir d'éléments de type bloc, notamment les éléments de titre <hn>. Si le contenu d'un <dt> ne peut pas être décrit comme un titre, il ne peut pas se voir reconnaître l'importance hiérarchique qui devrait aller avec un titre. De même, Google et les autres moteurs de recherche n'indexeront pas les listes de définitions de la même manière que les contenus reconnus comme des titres.

Les listes de définitions ne peuvent pas avoir l'apparence de données tabulaires, mais elles peuvent contenir des éléments d'accessibilité comme des descripteurs (labels) et des en-têtes (headers) pour mieux relier les informations. Pour cette raison, elles ne devraient pas être utilisées en remplacement de données tabulaires complexes.

Le passage que j'ai volontairement mis en gras, indique une différence de référencement de la part des différents moteurs de recherche.
As-tu des explications complémentaires là-dessus ? Est-ce se tirer une balle dans le pied dans mon cas ?

Bien à toi et merci de t'être intéressé à mon cas
Séby.

Tu as aussi la solution de <table>. Sur chaque ligne tu fais deux colonnes, et ton titre fera un retour à la ligne comme tu le désire je pense.

bonjour,

ou en faisant usage des flottant
en balisant la date dans un span (element neutre qui sert a ce genre de chose) en flottant a gauche .
ou en passant le lien devant la date , en float:right;

GC


<edit> Ce probleme de style ne semble pas nouveau , je viens de retrouver un exemple de 2006 : http://gcyrillus.free.fr/trucs_css/fiche-contact-en-liste.html (dommage je n'ai pas conservé le lien du topic d'origine) </>
Modifié par gcyrillus (31 Mar 2009 - 21:40)