Tabella semitrasparente ok, ma il testo non dovrebbe esserlo!

[AltF4]

Ciao a tutti, ho realizzato una tabella che mi servirà da menu e l'ho resa sempitrasparente con questo stile:

.prova {
	background-color:#000000;
	FILTER:alpha(opacity=50);
}

Tutto ok, le celle della tabella sono semitrasparenti, il mio problema è che rende anche il testo al suo interno semitrasparente.

Come evitarlo?

Grazie mille!

[MaxSimon]

Devi utilizzare due elementi sovrapposti: su quello sotto imposti la trasparenza, su quello sopra no.
p..: ma se utilizzi i div invece delle tabelle non ti viene più semplice?

Ciao.

[Prill]

Per la trasparenza puoi usare valori rgba, con css appoaito per versioni di Explorer inferiori alla 8:

<style type="text/css">
#prova {
background-color:rgba(0,0,0,0.5)}
</style>

<!--[if lte IE 8]>
<style type="text/css">
#prova {background: transparent;
-ms-filter: "progid&#58;DXImageTransform.Microsoft.gradient(startColorstr=#7F000000,endColorstr=#7F000000)"; /* IE8 */    
filter: progid&#58;DXImageTransform.Microsoft.gradient(startColorstr=#7F000000,endColorstr=#7F000000);   /* IE6 & 7 */
zoom: 1;
}
</style>
<![endif]-->

[AltF4]

Scusami, dove inserisco IF, all'interno del file CSS oppure all'interno della pagina dove lo carico?

Mi spiego meglio, al momento collego un file css esterno, IF lo inserisco al suo interno oppure lo faccio direttamente al momento del caricamento della pagina, SE è in uso IE inferiore a 8 carica il CSS1 altrimenti carica il 2?

[Prill]

Il primo css sarà caricato da tutti i browser, anche da tutti gli Explorer, il secondo solo dalle versioni di explorer indicate (explorer 9 ha il supporto per rgba). Se il css è esterno salvi le regole in un file esterno e nella tua pagina inserisci il richiamo, dopo quello dell'altro foglio di stile, nel commento condizionale:

[AltF4]

Mmm.. Potrebbe essere tutto perfetto, ma non lo è.

Ho provato con IE8 e funziona correttamente, lo stesso dicasi con Firefox e addirittura con IE6, ma con IE9 non ne vuol sapere di funzionare..

Ho fatto in questo modo:

- nella pagina ho caricato il CSS per tutti così:

<link href="css1.css" rel="stylesheet" type="text/css">

e nella riga successiva ho caricato il CSS per chi ha una versione inferiore alla 8 di IE così:

Questo è il css1.css:

.prova {
	background-color:rgba(0,0,0,0.5)
	FONT-SIZE: 12px; FONT-STYLE: normal; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; 
	TEXT-DECORATION: none

}

e questo è il NOIE8.css:

.prova {background: transparent;
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F000000,endColorstr=#7F000000)"; /* IE8 */    
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F000000,endColorstr=#7F000000);   /* IE6 & 7 */
zoom: 1;
}

Ho applicato lo stile "prova" a tutta la tabella che è posizionata in alto ed occupa tutta la larghezza della pagina, la userò per menu.

A questo punto mi chiedo: perchè IE9 non ne vuole sapere di funzionare?

[AltF4]

Non volevo inserire le faccine nel codice, ma non capisco perchè me le abbia inserite..

[Prill]

Le faccine sono inserite dal forum perché quando si ha a che fare con Explorer serve un po' di buon umore

no, sono i caratteri : e D che attaccati son resi con lo smile, io ero riuscita solo oggi nel risponderti ad evitarlo inserendo al posto dei due punti il corrispondente codice ascii : il che non è molto pratico.

Non ho Explorer9 e quindi non posso seguirti oltre, ma il dubbio è: fai lavorare il browser in modalità standard (usi un Doctype completo)?
Se è così e il problema non sta lì, converrà che aspetti chi usa ie9, nel frattempo però puoi verificare se ie9 rende, forse sì, il filter gradient del css dedicato, modificando il commento condizionale da <!--[if lte IE 8]> a <!--[if IE]>, prova e dicci (per curiosità)

[AltF4]

Lo so che : e D attaccati vengono interpretati come uno smile ed automaticamente sostituiti da , mi chiedevo come fosse stato possibile a te non farlo uscire e mi hai risposto che hai utilizzato il codice ascii.. ho imparato un'altra cosa.. : e D, anzi !

Per quanto riguarda il problema della trasparenza, sembra essere risolto anche su IE9, grazie al tuo aiuto ovviamente!