[css]problema webdesign - formattare i link

[RedLine_24_12]

ciao a tutti,

ho un problema con delle formattazioni in css..
sono davanti al pc per finire vari lavori da 12 ore e mi stò friggendo il cervello .. tantè che nn riesco a fare una cosa così banale che ho fatto altre volte ..

ho una pagina in php (sarebbe uso il cms Joomla) in cui volgio avere un menu con i vari pulsanti per le differenti pagine del sito

il menu deve avere dei pulsanti come sfondo sotto ai vari link ..

se li metto nel css in questo modo funziona:

a:link, a:visited {
display : block;
width : 130px;
line-height : 21px;
font-size : 11px;
color : #c5c5c5;
text-decoration : none;
font-weight : bold;
background : url(../images/button_normal.png) no-repeat;
text-indent : 24px;
padding-bottom : 2px;
}
a:hover {
display : block;
width : 130px;
line-height : 21px;
font-size : 11px;
color : #c5c5c5;
text-decoration : none;
font-weight : bold;
background : url(../images/button_hover.png) no-repeat;
text-indent : 24px;
padding-bottom : 2px;
}
a:active {
display : block;
width : 130px;
line-height : 21px;
font-size : 11px;
color : #c5c5c5;
text-decoration : none;
font-weight : bold;
background : url(../images/button_active.png) no-repeat;
text-indent : 24px;
padding-bottom : 2px;
}

però ovviamente vengono modificati anche tutti gli altri link che compaiono nella pagina ..

non posso dare ai link del menu una classe in modo da cambiare il css così:

a.NOMECLASSE:link, a.NOMECLASSE:visited {
display : block;
width : 130px;
line-height : 21px;
font-size : 11px;
color : #c5c5c5;
text-decoration : none;
font-weight : bold;
background : url(../images/button_normal.png) no-repeat;
text-indent : 24px;
padding-bottom : 2px;
}
perchè i link vengono generati al momento e non sono scritti nel codice ..

ho provato a mettere il modulo che genera i link nei tag <div> </div>
dandogli una classe <div class="menu"></div>

e poi nel css:
a.menu:link, a.menu:visited {
display : block;
width : 130px;
line-height : 21px;
font-size : 11px;
color : #c5c5c5;
text-decoration : none;
font-weight : bold;
background : url(../images/button_normal.png) no-repeat;
text-indent : 24px;
padding-bottom : 2px;
}

ma ovviamente non funziona ..


come faccio?

[RedLine_24_12]

risolto grazie

[anonimizzato]

Ciao,

bene che tu abbia risolto, tuttavia la prossima volta magari spiega comunque la soluzione che hai trovato in modo che possa eventualmente essere di aiuto ad altri con lo stesso problema o analogo.

P.S.
Finalmente uno che posta il codice in modo chiaro e ben indentato.
Complimenti! :D

[RedLine_24_12]

Ciao,

bene che tu abbia risolto, tuttavia la prossima volta magari spiega comunque la soluzione che hai trovato in modo che possa eventualmente essere di aiuto ad altri con lo stesso problema o analogo.

P.S.
Finalmente uno che posta il codice in modo chiaro e ben indentato.
Complimenti! :D

:D grazie,

no problem ... anzi vi spiego subito:

lo spezzone di codice PHP che crea il menu stava dentro a due div:

<div class="modul_content">
<div id="mainmenu">
<jdoc:include type="modules" name="left" />
</div>
</div>

io cercavo di definire nel CSS i links che stanno nel DIV con la classe "modul_content" ..
invece dovevo definire nel CSS i links che stanno nel DIV con ID "mainmenu"
perchè questa è il div in cui stanno i links che voglio cambiare .. siccome gli ho messi in due div diversi i links prendono solo gli attributi che do al secondo div (quello in cui stanno veramente e non quello in cui sta il div che contiene i links)

infatti adesso il CSS è così:

#mainmenu a:link, #mainmenu a:visited {

display : block;
width : 110px;
line-height : 21px;
font-size : 11px;
color : #c5c5c5;
text-decoration : none;
font-weight : bold;
background : url(../images/button_normal.png) no-repeat;
background-position: left;
border: 0px solid #ff0033;
text-indent : 3px;
padding-bottom : 2px;
padding-left : 0px;
}
#mainmenu a:hover {
display : block;
width : 110px;
line-height : 21px;
font-size : 11px;
color : #ffffff;
text-decoration : none;
font-weight : bold;
background : url(../images/button_active.png) no-repeat;
text-indent : 7px;
padding-bottom : 2px;
padding-left : 0px;
}
#mainmenu a:active {
display : block;
width : 110px;
line-height : 21px;
font-size : 11px;
color : #ffffff;
text-decoration : none;
font-weight : bold;
background : url(../images/button_active.png) no-repeat;
text-indent : 7px;
padding-bottom : 2px;
padding-left : 0px;
}
a:link, a:visited {

font-size : 11px;
color : #c5c5c5;
text-decoration : none;
font-weight : bold;

}
a:hover {

font-size : 11px;
color : #ffffff;
text-decoration : none;
font-weight : bold;

}
a:active {

font-size : 11px;
color : #ffffff;
text-decoration : none;
font-weight : bold;

}

e tutto funiziona a meraviglia .. i links nel menu hanno un certo colore e una certa immagine di sfondo .. invece i links nel resto della pagina non hanno immagine di sfondo ..

ciao!