Hi, I've got an issue with repeating section in my table. I use div to simulate a table (It's the first time I use div as table in my sheets). When there's no element in the table, it looks ok but when I add an element, the first head cell has a width equal to the row width. Here's the code : HTML <div class="sheet-rTable">
<div class="sheet-rTableHeadRow">
<div class="sheet-rTableHead">Nom</div>
<div class="sheet-rTableHead">%</div>
<div class="sheet-rTableHead">Dégâts</div>
<div class="sheet-rTableHead">Structure</div>
<div class="sheet-rTableHead">Longueur</div>
<div class="sheet-rTableHead">Main</div>
<div class="sheet-rTableHead"> </div>
</div>
<fieldset class="repeating_contactWeapons">
<div class="sheet-rTableRow">
<div class="sheet-rTableCell">
<input name="attr_contactWeaponName" type="text" class="sheet-box" />
</div>
<div class="sheet-rTableCell">
<input name="attr_contactWeaponPercent" type="number" class="sheet-box" />
</div>
<div class="sheet-rTableCell">
<input name="attr_contactWeaponDamage" type="text" class="sheet-box" />
</div>
<div class="sheet-rTableCell">
<input name="attr_contactWeaponStructure" type="text" class="sheet-box" />
</div>
<div class="sheet-rTableCell">
<input name="attr_contactWeaponLength" type="text" class="sheet-box" />
</div>
<div class="sheet-rTableCell">
<input name="attr_contactWeaponHand" type="text" class="sheet-box" />
</div>
<div class="sheet-rTableCell">
<button type="roll" value="" name="roll_contactWeaponCheck"></button>
</div>
</div>
</fieldset>
</div>
CSS .sheet-rTable {
display: table;
width: 100%;
font-size: 11px;
}
.sheet-rTableRow {
display: table-row;
}
.sheet-rTableHeadRow {
display: table-header-group;
}
.sheet-rTableHead {
background-color: grey;
font-weight: bold;
}
.sheet-rTableCell,
.sheet-rTableHead {
display: table-cell;
padding: 3px 10px;
} Did I use it wrong ? What should I do to fix this problem ? Thanks.
