opacità ok... ma i link?

[alelaps]

Salve...
ho impostato il colore di sfondo di un div trasparente-opaco... Il problema è che i link presenti nel div diventano solo delle immagini (non sono più cliccabili)...
Qualcuno sa perchè? come lo risolvo?

ciao

[fcaldera]

Lo sfondo opaco è realizzato tramite opacity oppure png trasparenti?

Posta tutto il codice che hai usato.

[Mich_]

Devi spiegarti meglio, e includere un pezzetto di codice HTML+CSS.

Il tuo termine trasparente-opaco significa semitrasparente?
Come hai realizzato la semitrasparenza? tramite l'immagine di sfondo o tramite filter/opacity?
In quale browser hai testato?
Ci sono per caso sovrapposizioni di blocchi?

[alelaps]

Adesso posto il codice, ma mi rendo conto che c'è qualcosa di sbagliato, perchè in FF non funziona... E' una soluzione che ho trovato in un altro thread, solo che in quel thread veniva usato solo per del testo..

L'opacità è realizzata con png semi-trasparenti.
Browser : IE 6 (in FF non si vede lo sfondo)
Sovrapposizione di blocchi non mi sembra che vi siano.

CSS:

div#navigationR{
             position: absolute;
	left: 84%;
	width:16%;
             top: 170px;
             right: 0;
	height:100%;
	border-color: #115511;
	border-width: 3px;
	border-style: solid;
}
div#navigationR[class]
{
	background-image:url(verde75.png);
	background-repeat: repeat;
	background-attachment: fixed;
}

HTML:

<div id="container">
<div id="header">.........</div>
<div id="navigationR">
<ul id="GreenButton">[*][img]immagini/bottoni/bottoneHome.png[/img][*][img]immagini/bottoni/bottoneSquadre.png[/img][*][img]immagini/bottoni/bottoneRegolamento.png[/img][*][img]immagini/bottoni/bottoneSerieA.png[/img][*][img]immagini/bottoni/bottoneCalendario.png[/img][*][img]immagini/bottoni/bottoneQuotazioni.png[/img][*][img]immagini/bottoni/bottoneContatti.png[/img][*][img]immagini/bottoni/bottoneFormazionix.png[/img][*][img]immagini/bottoni/bottoneRisultati.png[/img][*][img]immagini/bottoni/bottoneClassifiche.png[/img][*][img]immagini/bottoni/bottoneAlbo.png[/img][/list]
</div>

<div id="content">......</div>
</div>

[Mich_]

Ci sono delle cose che non sono molto corrette.

Anzitutto la larghezza totale e` > 100% (84%+16%+6px), per cui non mi meraviglia che FF non mostri qualcosa.

Poi il posizionamento: in generale usare il position crea piu` problemi di quanti ne risolva; un bel float e` piu` semplice da usare. Vedi anche gli articoli I posizionamenti assoluti e Capire i posizionamenti relativi

Tieni presente che un .png non viene visto nativamente da IE6-: occorre un filtro apposito. Trovi info in questo forum (fai una ricerca) oppure in rete.

[fcaldera]

http://forum.html.it/forum/showthrea...light=png+link

[alelaps]

@mich : ok hai ragione, ho impostato il width a 15% (invece che 16) ed ho applicato il filtro:

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='verde.png');

usando il float, come diverrebbe il codice CSS? devo applicarlo al div e togliere il left (per il float:right)?

@fcaldera

grazie, è effettivamente il thread che mi interessava... ma usando questa soluzione tutti gli allineamenti saltano (sfondo trasparente applicato a tutta la pagina, bordo cancellato, link spostati in basso... un casino insomma).
Prima di usare questa soluzione devo studiarmi meglio i position... comunque grazie

[Mich_]

Tra un sito fatto a posizionamenti ed uno fatto tramite float c'e` molta differenza. Cambia praticamente l'impostazione del CSS (e in qualche caso vengono introdotte marcature per correggere alcune pecche del posizionamento, nel qual caso occorre modificare anche l'HTML).

Per cui non sono in grado di dirti come modificare quel pezzetto di CSS: la modifica va fatta anche sui blocchi precedenti e su quello che segue. Ma credo che convenga riscrivere il CSS daccapo.

Potresti cercare qualche layout che assomiglia a quello che vuoi realizzato senza posizionamenti e adattarlo ai tuoi blocchi. Puoi partire dalla sezione layout dei "link utili".

[alelaps]

ok grazie per gli aiuti