[Résolu] Largeur des colonnes

Bonjour à tous,
je suis un vieux de la vieille qui utilisait jusqu'à hier, les bons vieux tableaux en dur ! (tout ce que vous n'aimez pas
J'ai acheté des bouquins sur les css, et j'essaye y compris sur le web de comprendre un truc tout bête pour vous mais casse-tête pour moi car à force de lire, je m'embrouille complètement

résumé:
j'ai un tableau avec 3 colonnes et 3 rangées de cellules dont la 1ere rangée est le "th"
voici le code html:

<table id="table" summary="commandez ici en indiquant vos quantités">
<caption>commandez ici en indiquant vos quantités</caption>

<tr>
<th class="th">Quantité</th>
<th class="th">Designation</th>
<th class="th">Prix</th>
</tr>

<tr>
<td class="td">cellule A1</td>
<td class="td">cellule B1</td>
<td class="td">cellule C1</td>
</tr>

<tr>
<td class="td">cellule A2</td>
<td class="td">cellule B2</td>
<td class="td">cellule C2</td>
</tr>
</table>

mon problème:
comment définir:
- une largeur de 15% à la première colonne,
- une largeur de 70% à la colonne désignation
- une largeur de 15% à la colonne prix

voilà mon css actuel:

#table {
margin: auto;
border: 2px solid #3A4C2D;
border-collapse: collapse;
width: 70%;
}
.th {
font-family: Arial;
font-weight: bold;
text-align: center;
border: 2px solid #3A4C2D;
padding: 5px;
background-color: #D0E3FA;
}
.td {
font-family: arial;
border: thin solid #3A4C2D;
padding: 5px;
text-align: center;
background-color: #ffffff;
}
caption {
font-family: Arial;
}

J'ai lu des tas de trucs sur les tableaux mais je n'ai pas trouvé une seule explication aussi rustique que celle là
Je vous remercie d'avance pour votre aide précieuse
Bien à vous
VieuxJeu

Bonjour,
Affecter une classe différente aux th:

<tr>
<th  class="th1">Quantité</th>
<th  class="th2">Designation</th>
<th class="th3">Prix</th>
</tr>

puis styler h1 et h2 (h3 prendra la largeur qui reste donc 15%)

.th1 {
	width:15%;
}
.th2 {
	width:70%;
}

sachant que .th devient th

th {
font-family: Arial;
font-weight: bold;
text-align: center;
border: 2px solid #3A4C2D;
padding: 5px;
background-color: #D0E3FA;
}
.t

Note : il est inutile de créer une classe, comme .td par exemple, puisque cibler la balise td suffit.
Modifié par rodolpheb (26 Jan 2013 - 21:21)