cambiare l'aspetto delle incone pdf, mail, stampa

[chia88]

Ciao a tutti, sto creando un template personale per un sito joomla. Vorrei perō cambiare l'aspetto delle icone pdf, mail e stampa che vengono visualizzate accanto all'articolo (ho allegato un'immagine ), mi basterebbe anche solo togliere il contonorno, meglio di tutto cambiare l'incona. sapete aiutarmi grazie.

Qua sotto l'immagine, ho cerchiato e messo delle frecce verdi attorno al problema...



grazie.

[adottauncane]

Ciao chia88,
per cambiare le icone sostituisce con le tue quelle di defaut che trovi in
/images/M_images/pdf_button.png
per togliere il contorno probabilmente dovrai intervenire sul file css del template. Se vuoi una mano serve un link al sito.

[chia88]

grazie per la sostituzione. Il sito web non č on-line, ma ti allego il codice css...

Codice: [Seleziona]

@charset "utf-8";
body {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;
background-color: #F0F0F0;
}
p {
color: #000;
}

#body {
float: left;
width: 530px;
padding-left: 15px;
}
#right {
float: right;
width: 195px;
}
#syndacate {
width: 950px;
margin-top: 5px;
margin-right: auto;
margin-left: auto;
}





#wrapper {
width: 950px;
margin-top: 50px;
margin-right: auto;
margin-left: auto;
}
#header {
width: 950px;
height: 150px;
}

#logo {
float: left;
width: 195px;
margin-right: 15px;
background-repeat: no-repeat;
background-position: center center;
background-image: url(images/logo.png);
height: 150px;
}

#titolo {
float: left;
width: 540px;
margin-right: 15px;
text-align: center;
border: thin groove #F60;
background-image: url(images/titolo.png);
background-repeat: no-repeat;
background-position: center center;
}

#search {
width: 170px;
float: right;
line-height: 2px;
height: 150px;
padding-left: 10px;
}
#leftbar {
float: left;
width: 206px;
border-right-width: thin;
border-right-style: inset;
border-right-color: #95A9BB;
}
#leftbar ul {
text-decoration: none;
list-style-image: none;
list-style-type: none;
}
#leftbar li {
text-decoration: none;
float: left;
padding-left: -15px;
list-style-image: none;
list-style-type: none;
}



#user {
width: 544px;
margin-right: 510px;
margin-left: 195px;
margin-top: 25px;
}
#top {
width: 930px;
margin-right: 15px;
margin-left: 15px;
margin-top: 10px;
margin-bottom: 20px;
height: 50px;
background-color: #CCC;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
#user1 a {
font-size: 12px;
color: #FF8000;
text-align: right;
}
#user2 a {
font-size: 12px;
color: #FF8000;
text-align: right;
}


#user1 a:hover {
font-style: italic;
}
#user2 a:hover {
font-style: italic;
}


#top ul {
text-decoration: none;
list-style-image: none;
list-style-type: none;
}
#top li {
text-decoration: none;
list-style-image: none;
list-style-type: none;
float: left;
padding-right: 10px;
padding-left: 10px;
margin-top: 10px;
margin-bottom: 20px;
margin-right: auto;
margin-left: auto;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
#top a {
color: #C09100;
text-decoration: none;
text-align: center;
}
#leftbar a {
color: #FF8000;
text-decoration: none;
font-weight: bold;
vertical-align: 20%;
}
#body a {
font-weight: bold;
color: #A93520;
text-decoration: none;
}
#body a:hover {
font-variant: small-caps;
}


.componentheading {
font-size: 24px;
font-variant: small-caps;
text-transform: uppercase;
color: #CC0000;
}
.contentheading {
font-size: 16px;
font-style: italic;
color: #FF5555;
}

#leftbar a:hover {
background-color: #FFD9B3;
}


#top a:hover {
text-decoration: underline;
background-color: #F0F0F0;
}


h1 {
font-size: 36px;
font-variant: small-caps;
color: #FC8E00;
}
h2 {
font-size: 18px;
font-style: italic;
color: #F60;
}


#user1 {
float: left;
width: 270px;
border-right-style: inherit;
border-right-color: #333;
}
#user1 ul {
text-decoration: none;
list-style-image: none;
list-style-type: none;
}
#user1 li {
text-decoration: none;
float: left;
list-style-image: none;
list-style-type: none;
}
#user2 ul {
text-decoration: none;
list-style-image: none;
list-style-type: none;
}
#user2 li {
text-decoration: none;
float: left;
list-style-image: none;
list-style-type: none;
}
#user2 a {
text-decoration: none;
}
#user2 a:hover {
text-decoration: underline;
}
#user1 a {
text-decoration: none;
}
#user1 a:hover {
text-decoration: underline;
}

#syndcate {
height: 50px;
width: 700px;
margin-top: 15px;
margin-right: 125px;
margin-left: 125px;
background-image: url(images/syndacate.png);
background-repeat: no-repeat;
background-position: center center;
}
#syndacate a:hover {
font-weight: bolder;
font-variant: normal;
text-transform: uppercase;
}

#syndacate a {
font-size: 12px;
color: #C60;
text-decoration: none;
text-align: center;
padding-right: 10px;
padding-left: 10px;
background-image: url(images/syndacate.png);
}

#user2 {
float: right;
width: 270px;
border-right-style: none;
}

notavo che su chrome il contorno non c'č mentre su firefox mi fa il contorno...

[tič]

č cosė, firefox aggiunge un bordo alle immagini. E' una cosa che fa da molto tempo e ogni browser rende il nostro codice in maniera diversa. E allora in molti hanno scritto dei fogli di stile che resettano le impostazioni di default dei browsers e le fanno diventare tutte uguali. Puoi trovare queste impostazioni qui:
http://cssresetr.com/
Nel tuo caso occorre aggiungere al tag img l'istruzione per il browser di non mettere il bordo:

Codice: [Seleziona]

img { border: 0px; }
Ciao

[chia88]

non ho capito quando dici

Codice: [Seleziona]


Nel tuo caso occorre aggiungere al tag img l'istruzione per il browser di non mettere il bordo:

[code]img { border: 0px; }
dove devo aggiungere

img { border: 0px; }[

? al file css? se si in che punto?

[tič]

In genere si aggiungono le regole alla fine.
Quelle che si mettono alla fine sovrascrivono le regole che sono all'inizio. Nel tuo caso non mi pare che ci siano delle regole che riguardano il TAG img quindi puoi mettere la regola dove vuoi. E cmq mettila alla fine.

[chia88]

grazie 1000 l'ho aggiunto alla fine del documento css e su firefox non ho pių il problema. grazie ancora

[tič]

e allora metti [RISOLTO] nel titolo per piacere.