Tabulations variables avec remplissage personnalisé CSS3

Bonjour à tous !

J'aurais besoin de votre savoir immense afin de sauver le design de mon site...
En effet, j'aimerais pouvoir faire une tabulation dynamique, un peu comme avec les traitements de textes, comme sur cette image :


Voici un morceau du code sur lequel je voudrais appliquer cet effet :

HTML :

<tr>
	<td class="carteNomPlat">Noix de Saint-Jacques grillées</td>
	<td class="cartePrixPlat">25,00€</td>
</tr>

En fait, .carteNomPlat a une largeur de 590px, et un texte aligné à gauche. J'aimerais compléter l'espace entre le dernier caractère du <td class="carteNomPlat"> et la fin de la case par un effet de tabulation, en CSS si possible, car je n'y connais rien en JS.

Comment faire ? Merci de votre aide !
Modifié par DamsW (16 Feb 2014 - 17:27)

Si tu tiens a faire ceci avec un tableau, j'opterais pour l'ajout d'une cellule centrale et d'un reformatage du tr en table pour que chaque ligne aient des largeurs de colonnes indépendantes : http://codepen.io/gc-nomade/pen/giBsL
pris dans la boite à outils CSS: selecteur :empty et pseudo-element, table-layout + tr en display:table.

Parfait ! Merci beaucoup !!!

Bonne soirée !

T'as plusieurs solutions ici aussi :

http://forum.alsacreations.com/topic-4-19563-1-Defi-css--remplir-avec-des-points.html

jb_gfx a écrit :
T'as plusieurs solutions ici aussi :

http://forum.alsacreations.com/topic-4-19563-1-Defi-css--remplir-avec-des-points.html

mouais, pourquoi faire simple quand on peut faire compliquer et refaire la structure HTML la ou un tableau convient ?

gc-nomade a écrit :

mouais, pourquoi faire simple quand on peut faire compliquer et refaire la structure HTML la ou un tableau convient ?

Le lien présente plusieurs techniques et c'est pour apprendre, j'ai jamais dit qu'il fallait recopier bêtement.

Perso j'aurais pas rajouté une cellule vide mais un simple span autour du nom.

re, ma réponse était incomplète , le temps de retrouver le lien que je cherchais http://blog.goetter.fr/post/36207593962/tes-pas-cap-n-2-table-et-pointilles (j'avais initialement fait ceci http://codepen.io/gcyrillus/pen/jbDhn et refait sous dabblet http://dabblet.com/gist/4129231 )

@jb_gfx , Je suis d'accord avec toi . il est toujours mieux de connaitre plusieurs techniques ou moyens, on a ensuite le choix . Il n'y a pas ou rarement de solution universelles .
Modifié par gc-nomade (16 Feb 2014 - 20:34)