Problema con stile su Asp.Net Menu control

martedì 31 maggio 2011 - 15.22

Elenco Threads

Stanze Forum

Aggiungi ai Preferiti

Cerca nel forum

Augusto Profilo | Newbie

8 messaggi | Data Invio: mar 31 mag 2011 - 15:22

Buongiorno,
sto utilizzando il controllo Menu in una applicazione web con Asp.Net 2.0.
Negli items del menu ho utilizzato una immagine di sfondo, ma no riesco ad eliminare il colore background dietro il testo.

264x57 3Kb

Credo che dietro al testo venga inserita la stessa immagine, perchè se la cambio varia anche lo sfondo del testo.

Qualche idea su come eliminare questo problema?
Grazie
A. V.

alexmed Profilo | Guru

1.186 messaggi | Data Invio: mar 31 mag 2011 - 15:53

Ciao
La soluzione che ho adottato io è fare in modo che il link ricopra tutta l'area che occupa nel "td".
Il menu presenta uno stile StaticMenuItemStyle al quale devi attribuire una classe in cui siano previsti questi parametri

.StaticMenuItem
{
line-height: 2em; /* questo serve per aumentare o diminuire l'altezza */
display: block;
background-image: url('...');
/* altro */
}

Prova, al limite postaci il tuo codice, CSS compreso

Ciao

alexmed

Augusto Profilo | Newbie

8 messaggi | Data Invio: mar 31 mag 2011 - 17:17

Ok grazie,
questo risolve bene il problema anche se purtoppo ne apre un altro probabilmente legato alle differenze tra IE e FF.

L'immagine che utilizzo come background è alta 25.
In pratica su FF devo aumentare la dimensione a 27 altrimenti mi scompare il bordo degli elementi.
In ogno caso su FF scompare sempre il bordo dx dell'ultimo elemento statico (il più a dx)

Grazie comunque
A. V.

alexmed Profilo | Guru

1.186 messaggi | Data Invio: mar 31 mag 2011 - 17:34

Prova anche a vedere gli effetti dei margini e del padding che dovrebbe essere per entrambi impostato a zero
e a questo punto prova anche ad eliminare line-height e impostare l'altezza

Ciao

alexmed

Augusto Profilo | Newbie

8 messaggi | Data Invio: mar 31 mag 2011 - 17:49

Si, avevo già impostato margin e padding a 0 ed il problema resta.
Per avere il solito comportamento tra IE e FF (almeno in parte) devo impostare l'altezza di 2px in più rispetto alle dimensioni dell'immagine di backgroung (considerando che ho il bordo si 1px negli elementi). E comunque mi rimane incomprensibile il problema del bordo dx dell'ultimo elemento.

PS. Se elimino il line-height perdo l'allineamento verticale del testo nei menu items.

Grazie
A. V.

Augusto Profilo | Newbie

8 messaggi | Data Invio: mar 14 giu 2011 - 17:56

Grazie per le risposte; ho però risolto così:

display: block non va messo a livello di menu item ma a livello del link. Quindi:

.StaticMenuItem
{
/* display: block;*/
background-image: url('...');
/* altro */
}

a.StaticMenuItem
{
display: block;
}

In questo modo il rendering della tabella che contiene il menu con l'immagine di sfondo è fatto correttamente (bordi compresi) ed il testo del link non ha sfondo.

A. V.

Torna su

Stanze Forum

Elenco Threads

Partecipa anche tu! Registrati!

Hai bisogno di aiuto ?
Perchè non ti registri subito?

Dopo esserti registrato potrai chiedere
aiuto sul nostro Forum oppure aiutare gli altri

Consulta le Stanze disponibili.

Registrati ora !