Date un'occhiata a questo esempio qui:larghezza tbody che non si estende automaticamente alla larghezza della tabella
E le tabelle rosse sotto "tecnici" non sta diventando l'intera larghezza del che lo contiene - durante l'ispezione su Firebug, il div non è di 220 pixel, ma piuttosto di appena 100 pixel in base alla larghezza del contenuto.
<div class="grid_4 alpha">
<table width="100%" class="grid_4 alpha omega">
<tr class="specrow">
<td class="specname">type:</td>
<td class="specvalue">House</td>
</tr>
<tr class="specrow">
<td class="specname">year:</td>
<td class="specvalue">1986</td>
</tr>
</table>
</div>
codice CSS è simile al seguente:
#listing_specs table {
width: 100%;
}
#listing_specs table tbody {
display: table-row-group;
width: 100%;
}
.specrow {
margin:2px 0px;
border-bottom:1px dotted #dadada;
color: #fff;
width: 100%;
background-color: #A92229;
}
.specrow:hover {
background-color:#fff;
color:#333;
}
.specname{
font-weight: 600;
padding:2px 2px 2px 5px;
width: 50%;
white-space: nowrap;
}
.specvalue {
font-weight:normal;
padding:2px 5px 2px 5px;
text-align:left;
width: 50%;
}
So che c'è un resetter CSS generici, e penso che è quello che sta causando il problema. Purtroppo non posso andare e rimuovere solo il riferimento ad esso perché più siti si riferiscono ad esso dalla stessa posizione in questo momento, e non posso semplicemente fare quel cambiamento senza un'attenta revisione. Quindi ho bisogno di un modo per sovrascriverlo sul foglio di stile stesso. Il codice CSS ripristinato è:
<link rel="stylesheet" type="text/css" media="all" href="http://demo.brixwork.com/master/css/reset.css" />
Wow. Così semplice ed efficace Grazie! – jeffkee
trascorso un minuto per accedere solo per votare perché mi ha fatto risparmiare molto tempo. – MAK
sì ho rovinato tutto con display: inline-block - ma avrei potuto usare display: anche il tavolo in linea – Fanky