Annullare stile ereditato

**Prisco** · 22-11-2011, 21:44

Salve il mio problema è il seguente :

IO imposto il seguente stile a una tabella

codice:

table.summary tr th { font-size:14pt; font-weight: bold; text-align:left; background:#a6caf0;}
table.summary tr td { background:#eeeee0; text-align:center; }


<table class="summary">
<tr>13 colonne<tr>
<tr colspan="13">
<table>Altre colonne</table>

Come potete vedere io dichiaro una tabella in cui setto il colore di background delle righe e poi all'interno della tabella creo un 'altra tabella (anche per far si che le mie due tabelle abbiano la stessa grandezza.
Il punto è che voglio eliminare l'eredità della seconda tabella e lasciare white il bgcolor perchè in seguito in base ad alcuni calcoli devo settare il color del tr (che su più linee sulla seconda tabella può anche variare, es: rosso/nero)

Potete darmi una mano?

Ho provato anche a settare width=100% su entrambi le tabelle divise(al principio) ma la larghezza non si setta in autosize per intenderci(prendere la larghezza massima dello schermo)

Grazie in anticipo

**ldetomi** · 22-11-2011, 22:58

L'unica alternativa che hai è sovrascrivere il colore di sfondo per la seconda tabella. Il problema della tabella più interna infatti non è che ha lo stesso sfondo di quella esterna, ma che ce l'ha trasparente! Quindi ti fa vedere quello della tabella che la contiene!

In ogni caso stai creando un layout come si faceva 10 anni fa, ovvero in maniera assai deprecata... meglio passare direttamente alle nuove tecniche prima di incaponirsi su metodologie vetuste, non credi???

**Prisco** · 23-11-2011, 00:42

dico che hai ragione, di sicuro è un metodo antico, ma dipende tutto da cosa si deve fare .
A me serve un semplice report , costruibile con una semplice tabella , considerando anche che l'intera pagina devo costruirla tramite python la cosa si complica anche di più , per cui magari dammi un consiglio sulla vecchia soluzione o indirizzami su qualcosa di concreto su una nuova..

intanto grazie per la risposta

**ldetomi** · 23-11-2011, 00:49

Sulla vecchia soluzione te l'ho dato il consiglio... leggi bene!!! il tuo problema è che lo sfondo è in realtà trasparente e ciò che vedi è quello della tabella sotto, devi forzare un nuovo sfondo per la tabella più interna, l'ereditarietà purtroppo non si può interrompere......

**Prisco** · 23-11-2011, 00:51

se non inserisco la seconda tabella nella prima , perchè nn riesco a far si che la prima tabella abbia la larghezza pari alla dimensione massima della finestrA?

codice:

table
{
	width: 100%;
}

Dove sbaglio??
Comunque non so perchè , ma quando sovrascrivo e poi tento di settare il colore riga per riga, magari in seguito a dei controlli dei contenuti , non riesco + a settare il colore per <tr>

**ldetomi** · 23-11-2011, 00:54

E' un po' che non uso tabelle ma ricordo che tendenzialmente sono piuttosto capricciose su regole applicate direttamente al tag TABLE. Tendenzialmente proverei ad applicare lo stile alle colonne direttamente! Al momento non posso provare ma potresti provare tu a fare una tabella di 2 colonne entrambe larghe al 50%... potrebbe funzionare....

**Prisco** · 23-11-2011, 01:12

il problema è che creando due tabelle , la seconda tabella contiene + contenuti della prima, per cui la sua autosize è maggiore rispetto alla prima e le due tabelle non hanno la stessa larghezza...

**ldetomi** · 23-11-2011, 01:14

Senti posta un link funzionante ma SEMPLIFICATO e poi vediamo cosa si può fare provando in tempo reale....

**Prisco** · 23-11-2011, 01:30

ok ho capito e non mi piace settare entrambi le tabelle cn la stessa size, opterei per la seconda tabella nella prima e il settaggio di un bgcolor diverso, anche se come detto prima non mi riesce....non so perchè quando setto il secondo colore non funziona...

codice:

<html>
<style type="text/css">
body { margin-left: 2%; margin-right: 2%; font:normal verdana,arial,helvetica; color:#000000; }

table.summary tr th { font-size:14pt; font-weight: bold; text-align:left; background:#a6caf0;}
table.summary tr td { background:#eeeee0; text-align:center; }

</style>
<body>
</br>

<table border="1" class="summary">
<tr><td colspan="13"><h2>Summary</h2></td></tr>
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
<th>10</th>
<th>11</th>
<th>12</th>
<th>13</th>
</tr>
<tr>
<tr>
<td><div class="p0">116</div></td>
<td><div class="p1">42</div></td>
<td><div class="p2">1</div></td>
<td><div class="p3">29</div></td>
<td><div class="p4">0</div></td>
<td><div class="p5">2</div></td>
<td><div class="p6">0</div></td>
<td><div class="p7">0</div></td>
<td><div class="p8">0</div></td>
<td><div class="p9">0</div></td>
<td><div class="p10">30</div></td>
<td><div class="p11">12</div></td>
<td><div class="p12">0</div></td>
</tr>

<tr><td colspan="13"></td></tr>
<tr bgcolor="white"><td bgcolor="white" colspan="13">

<table border="1">
<tr>
<th align="left">File Name</th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
<th>10</th>
<th>11</th>
<th>12</th>
<th>13</th>
</tr>

<tr bgcolor="red" align="left"><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td></tr>
</table>
</tr>
</table>

<table>
<tr bgcolor="red" align="left"><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td><td>1</td></tr>
</table>

</body></html>

Semplice esempio

**ldetomi** · 23-11-2011, 01:46

Ti avevo chiesto un link funzionante.... non ho modo di provare con un editor.....

Discussione: Annullare stile ereditato

Strumenti discussione

Ricerca discussione

Visualizza

Annullare stile ereditato

Permessi di invio