Immagine cliccabile

[Valeria75_bis]

Please help me!!

[ResianTaxidrive]

secondo me i pulsanti sono cliccabili ma non appare il cursore con la manina.
Accade quando c'è lo span dentro una <a>. O forzi la visualizzazione del cursore o metti lo span fuori e la <a> dentro.

[Valeria75_bis]

Attualmente ho

<ul class="menu_extra">[*]
<a href="index.php?id=1" title="Home">
<span class="imgReplace">Home</span>
</a>
[*]
<a href="index.php?id=5" title="PDF">
<span class="imgReplace">PDF</span>
</a>
[/list]



Se invece provo a fare



<ul class="menu_extra">[*]
<span class="imgReplace">Home</span>

[*]
<a href="index.php?id=5" title="PDF">
<span class="imgReplace">PDF</span>
</a>
[/list]


Succede che non diventa cliccabile l'home (quello che ho cambiato) ma tutta l'area ha attivo il link index.php?id=5 (quindi sia il pulsante home che il pulsante PDF)

Cosa sbaglio?

Grazie

[ResianTaxidrive]

scusa una cosa:
questo: clip:rect(0,0,0,0);

cosa mi rappresenta in questo contesto? è nella classe ImgReplace che è quella dello span.

[Prill]

se scrivo ho un link vuoto, per quanto il collegamento sia presente le sue dimensioni sono nulle e quindi col mouse non ho uno spazio sul quale spostarmi e cliccare; lo stesso succede anche se all'interno del link ho dei contenuti, siano essi immagini o testo, per i quali ho settato larghezza ed altezza su zero, e quindi lo stesso succede per lo span che ha la funzione di nascondere un testo che sarebbe invece visibile se fossero disattivati i fogli di stile costituendo il contenuto del collegamento.
Lascia dunque lo span dov'è, all'interno di "a". Poi fai questa prova con una dichiarazione di stile in linea:

<a href="index.php?id=1" title="Home" style="display:block; width:100px; height:100px;   background-color:green">
<span class="imgReplace" style="display:none">Home</span> </a>

ora vedi il link? Modifica le dimensioni in base alle tue esigenze e al posto del colore di sfondo inserisci invece l'immagine di sfondo. Vedi il link?

[Valeria75_bis]

Non so se ho capito bene cosa intendevi... ho provato a fare:
[/list]
<ul class="menu_extra">[*]

<a href="index.php?id=1" title="Home" style="display:block; width:100px; height:100px; background-color:green">
<span class="imgReplace" style="display:none">Home</span> </a>

[*]
<a href="index.php?id=5" title="PDF">
<span class="imgReplace">PDF</span>
</a>
[/list]

ma non cambia nulla

[Prill]

ci fai vedere ciò che hai fatto in una pagina on line?

[Prill]

Aggiungi nel css

#content #header #menu .menu_extra {float:left;width:140px; height:50px;}
#content #header #menu .menu_extra li{margin:0 2px;}
#content #header #menu .menu_extra a { display:block; width:66px; height:50px;}

(con un doctype strict non sono consentiti attributi quali align o border (puoi eliminare il border da tutte le immagini nei link poiché il bordo è già impostato su zero nel css) né il target. Chiudi poi tutti i br, img, meta e correggi gli altri errori che ti segnalerà il validatore del w3c)

[Valeria75_bis]

Graaaaazie mille per l'aiuto!!!!

con un doctype strict non sono consentiti attributi quali align o border (puoi eliminare il border da tutte le immagini nei link poiché il bordo è già impostato su zero nel css) né il target.

non ho ben capito....

devo modificare align e border ... a cosa??
devo eliminare il target?? dove? nei link??


(chiaro invece il discorso dei tag da chiudere)

[Prill]

hai border=0" per tutte le immagini dei banner, inutile peraltro perché in uno dei css i bordi sulle immagini sono già azzerati. Quanto all'align, è presente in due div, un align="left" e un align="right", a ciascun div attribuisci un id che definirai nel css.
Poi, attenzione che in un css hai cose del tipo padding_top, margin_top, border_top invece di padding-top, margin-top, border-top, per trovarli facilmente passalo al servizio di validazione per i css.
Sul target, usandolo con xhtml strict non avrai la validazione, in quanto è attributo non consentito