Hallo,
ich habe folgendes Problem:
Ich formatiere meine Links in htmlarea im backend über das einbinden meiner css Datei:
RTE.default {
contentCSS = fileadmin/templates/css/rte_main.css
}
in der css Datei steht folgendes:
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color:#f7f7f7;
padding: 5px;
width: 574px;
min-height: 325px;
text-align: left;
font-size: 12px;
color: #101010;
}
.htmlarea-content-body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
margin:0;
padding:3px;
background-color:#f7f7f7;
color: #101010;
}
p {
font-size : 12px;
line-height : 16px;
margin : 10px 0;
}
ul {
list-style-type : none;
list-style-image : url(../img/pfeil_b.gif);
padding-left : 15px;
margin : 5px;
}
ul li ul {
list-style-image : url(../img/pfeil_o.gif);
padding-left : 15px;
margin-bottom : 5px;
}
img {
border : none;
}
a {
color:#3f52a0;
text-decoration : none;
}
a:link {
color : #3f52a0;
text-decoration : none;
}
a:visited {
color : #3f52a0;
text-decoration : none;
}
a:focus {
color : #df5511;
text-decoration : underline;
}
a:hover {
color : #df5511;
text-decoration : underline;
}
a:active {
color : #3f52a0;
text-decoration : none;
}
.external-link {
color:#3f52a0;
text-decoration : none;
}
.external-link-new-window {
color:#3f52a0;
text-decoration : none;
}
.internal-link {
color:#3f52a0;
text-decoration : none;
}
.internal-link-new-window {
color:#3f52a0;
text-decoration : none;
}
.download {
color:#3f52a0;
text-decoration : none;
}
.mail {
color:#3f52a0;
text-decoration : none;
}
.external-link:link {
color:#3f52a0;
text-decoration : none;
}
.external-link-new-window:link {
color:#3f52a0;
text-decoration : none;
}
.internal-link:link {
color:#3f52a0;
text-decoration : none;
}
.internal-link-new-window:link {
color:#3f52a0;
text-decoration : none;
}
.download:link {
color:#3f52a0;
text-decoration : none;
}
.mail:link {
color:#3f52a0;
text-decoration : none;
}
.external-link:visited {
color:#3f52a0;
text-decoration : none;
}
.external-link-new-window:visited {
color:#3f52a0;
text-decoration : none;
}
.internal-link:visited {
color:#3f52a0;
text-decoration : none;
}
.internal-link-new-window:visited {
color:#3f52a0;
text-decoration : none;
}
.download:visited {
color:#3f52a0;
text-decoration : none;
}
.mail:visited {
color:#3f52a0;
text-decoration : none;
}
.external-link:focus {
color:#df5511;
text-decoration : underline;
}
.external-link-new-window:focus {
color:#df5511;
text-decoration : underline;
}
.internal-link:focus {
color:#df5511;
text-decoration : underline;
}
.internal-link-new-window:focus {
color:#df5511;
text-decoration : underline;
}
.download:focus {
color:#df5511;
text-decoration : underline;
}
.mail:focus {
color:#df5511;
text-decoration : underline;
}
.external-link:hover {
color:#df5511;
text-decoration : underline;
}
.external-link-new-window:hover {
color:#df5511;
text-decoration : underline;
}
.internal-link:hover {
color:#df5511;
text-decoration : underline;
}
.internal-link-new-window:hover {
color:#df5511;
text-decoration : underline;
}
.download:hover {
color:#df5511;
text-decoration : underline;
}
.mail:hover {
color:#df5511;
text-decoration : underline;
}
.external-link:active {
color:#3f52a0;
text-decoration : none;
}
.external-link-new-window:active {
color:#3f52a0;
text-decoration : none;
}
.internal-link:active {
color:#3f52a0;
text-decoration : none;
}
.internal-link-new-window:active {
color:#3f52a0;
text-decoration : none;
}
.download:active {
color:#3f52a0;
text-decoration : none;
}
.mail:active {
color:#3f52a0;
text-decoration : none;
}
h1 {
font-size : 22px;
margin : 0;
padding : 5px 5px 10px 0;
font-family : Verdana;
color : #3f52a0;
}
h2 {
font-size : 20px;
margin : 0;
padding : 5px 5px 5px 0;
font-family : Verdana;
font-weight : bold;
color : #df5511;
}
h3 {
font-size : 18px;
margin : 0;
padding : 3px 0 3px 0;
font-family : Verdana;
font-weight : bold;
color : #3f52a0;
}
h4 {
font-size : 16px;
margin : 0;
padding : 3px 0 3px 0;
font-family : Verdana;
font-weight : bold;
color : #df5511;
}
h5 {
font-size : 14px;
margin : 0;
padding : 3px 0 3px 0;
font-family : Verdana;
font-weight : bold;
color : #3f52a0;
}
h6 {
font-size : 12px;
margin : 0;
padding : 3px 0 3px 0;
font-family : Verdana;
color : #df5511;
}
Die einzelnen Link-klassen müsste ich eigentlich nicht einzeln definieren, dass habe ich gemacht um dort einen Fehler auszuschließen ...
Der Effekt ist nun folgender:
Der Internetexplorer und auch Opera zeigen die Links und die anderen styles wie gewünscht an.
Im Firefox werden alle styles, abgesehen von den Links, korrekt dargestellt. Links im rte mit Firefox bleiben blau und unterstrichen, wie es Standard ist.
Wie bekomme ich also nun Firefox dazu, meine css angaben für Links im rte ebenfalls zu übernehmen?
Vielen Dank im Voraus!
Gruß,
Nils
NACHTRAG:
Im frondend verwende ich die gleichen style Angaben, interessanterweise werden diese dort sowohl vom Internetexplorer und Opera als auch von Firefox richtig verarbeitet.