Tableau et probléme de largeur de colonnes

Des livres incontournables pour tout maîtriser

Auteur
BODHI	# 13 Feb 2012, 11:35:52
2 Posts	Bonjour à tous, Bon voilà, je cherche mais je ne trouve pas comment faire ce truc basique (me semble t-il en tout cas). L'idée est le suivante : Pour faire très simple, je souhaite faire un tableau de 1 ligne et 2 colonnes ayant les caractéristiques suivantes : - La largeur globale du tableau est fixée (disons width : 50%) - La largeur de la première colonne s'adapte au contenu texte de la cellule - La largeur de la seconde colonne s'adapte automatiquement pour combler le reste du tableau L'image devrait être plus claire. Je peux préciser si besoin. Merci pour vos avis éclairés. Bodhi
2 Posts
fvsch	# 14 Feb 2012, 17:30:11
20100 Posts	Bonjour, Quelque chose comme: `table { width: 50%; } td:first-child { width: 10% /* ou autre valeur faible */ white-space: nowrap; } td:first-child + td { width: 90%; }`
20100 Posts
BODHI	# 15 Feb 2012, 10:22:45
2 Posts	Salut et merci pour cette réponse, Il s'agit là du CSS et sans vouloir faire mon gros boulet, le HTML pour la table donnerait quoi ? En gros, j'en suis là, mais après ? `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Document sans nom</title> <style type="text/css"> <!-- table {width: 50%;} td:first-child {width: 10%; white-space: nowrap;} td:first-child + td {width: 90%;} --> </style> </head> <body> </body> </html>`
2 Posts
fvsch	# 15 Feb 2012, 11:59:56
20100 Posts	BODHI a écrit : sans vouloir faire mon gros boulet, le HTML pour la table donnerait quoi ? Rien de spécial, un code de tableau tout ce qu'il y a de plus basique. Ça se trouvera dans le premier livre, tutoriel venu, ou même dans la spécification HTML. Donc quelque chose comme: `<table> <tr> <td>...</td> <td>...</td> </tr> </table>` Bien sûr, suivant le contenu exact, on aura peut-être une ligne d'en-tête avec des <th scope="col">...</th> à la place des <td>...</td>, ou bien des TH en première colonne (<th scope="row">...</th>). Il faut voir en fonction du contenu. Et dans le CSS que je donne on utilise des sélecteurs CSS 2.1 et on applique ces styles à tous les tableaux de la page. On voudra sans doute restreindre l'application des styles à certains tableaux précis, peut-être en passant par une ou plusieurs classes.
20100 Posts
Prévenir un modérateur