nicht angemeldet
<h3> Hintergrundbild im IE6
0 1 
MudGuard
<h3> Hintergrundbild im IE6
Gunnar BittersmannBei einem Joomla-Template habe ich große Probleme mit der Darstellung im IE6.
Für 3 verschiedene <h3> Überschriften benutze ich verschiedene Klassen, so dass diese Überschriften unterschiedliche Hintergrundbilder erhalten. IE6 zeigt allerdings nur für die erste Überschrift den korrekten Hintergrund an. Bei den folgenden beiden Überschriften wird gar kein Hintergrund angezeigt. FF zeigt alles korrekt an.
********************************************************************
Hier die HTML-Ausgabe (nur body):
<body>
<div id="wrap">
<div id="header">
</div>
<div id="sidebar">
<div class="moduletable-NavMenu1">
<h3>Überschrift 1</h3>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr align="left">
<td><a href="Ziel 1" lass="mainlevel">Link 1</a></td>
</tr></table></div>
<div class="moduletable-NavMenu2">
<h3>Überschrift 2</h3>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr align="left">
<td><a href="Ziel 2" lass="mainlevel">Link 2</a></td>
</tr></table></div>
<div class="moduletable-NavMenu3">
<h3>Überschrift 3</h3>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr align="left">
<td><a href="Ziel 3" lass="mainlevel">Link 3</a></td>
</tr></table></div>
</div><!-- END OF SIDEBAR -->
</div> <!-- END OF WRAP -->
</body><!-- END OF BODY -->
********************************************************************
Hier die css:
body{
text-align:center;
}
#wrap{
width:750px;
border:1px;
border-color:#006699;
border-style:solid;
margin:0px auto;
text-align:left;
}
#header{
background:url("../images/header.jpg");
background-repeat:no-repeat;
height:135px;
border-bottom: 1px solid #006699;
padding:10px;
}
#sidebar {
float:center;
position:relative; width:270px;
overflow:hidden;
}
/*-- BEGINN MODULDEFINITION --*/
.moduletable{
margin-bottom:1em;
padding:0 10px;
border:1px #CCC solid;
}
.moduletable-NavMenu1 h3{
background:url("../images/bild1.gif");
padding:4px;
background-repeat:no-repeat;
font-family:Verdana;
font-size:12px;
color:#FFFFF;
}
.moduletable-NavMenu2 a{
line-height: 250%;
text-decoration:none;
font-family:Verdana;
font-size:11px;
color:#333366;
padding-left:10px;
}
.moduletable-NavMenu2 h3{
/background:url("../images/bild2.gif");
padding:4px;
background-repeat:no-repeat;
font-family:Verdana;
font-size:12px;
color:#000000;
}
.moduletable-NavMenu2 a{
line-height: 250%;
text-decoration:none;
font-family:Verdana;
font-size:11px;
color:#333366;
padding-left:10px;
}
.moduletable-NavMenu3 h3{
background:url("../images/bild3.gif");
padding:4px;
background-repeat:no-repeat;
font-family:Verdana;
font-size:12px;
color:#FFFFFF;
}
.moduletable-NavMenu3 a{
line-height: 250%;
text-decoration:none;
font-family:Verdana;
font-size:11px;
color:#333366;
padding-left:10px;
}
/*-- ENDE MODULDEFINITION --*/
********************************************************************
Ich hoffe, mir kann jemand helfen. Ich suche schon seit einigen Tagen vergebens im Netz.
Besten Dank im Voraus, stakkabo.
-
Hi,
.moduletable-NavMenu1 h3{
background:url("../images/bild1.gif");
padding:4px;
background-repeat:no-repeat;
font-family:Verdana;
font-size:12px;
color:#FFFFF;
}setze mal überall die richtige Selektorschreibweise. In diesem Bsp. würde ich dem DIV eine id geben und dann auf h3 wenn es jedesmal anderst sein soll so zu greifen #moduletable-NavMenu1 h3
Ersetze ebenfalls background:url("../images/bild1.gif"); durch background-image: url(../images/bild1.gif); background wird benutzt um mehrere Eigenschaften zusammenzufassen wie Bild, Hintergrund etc ... also für Kurzform Eigenschaften nicht vorgesehen.
Gruß Jan
-
Hello out there!
setze mal überall die richtige Selektorschreibweise.
Hat er doch.
In diesem Bsp. würde ich dem DIV eine id geben
Der Hinweis, dass dafür eine ID, keine Klasse angebracht ist, ist dennoch völlig berechtigt. (Wenn er wohl auch nicht das Problem löst.)
Ersetze ebenfalls background:url("../images/bild1.gif"); durch background-image: url(../images/bild1.gif);
Nicht nötig.
background wird benutzt um mehrere Eigenschaften zusammenzufassen wie Bild, Hintergrund etc ... also für Kurzform Eigenschaften nicht vorgesehen.
Das stimmt nicht; du musst bei der 'background'-Eigenschaft nicht alles angeben. [CSS2 §14.2.1]
See ya up the road,
Gunnar--
„Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)-
Hallo. Besten Dank für eure Antworten.
Als Sektor eine ID zu verwenden ist mir leider nicht möglich, da der Code mit einem <div>-Tag von Joomla so generiert wird.
background-image: habe ich auch mal versucht, hat aber leider nichts gebracht.
Gibt es eventuell noch andere Möglichkeiten. Noch mal: der Kram funktioniert in Firefox einwandfrei, nur der IE 6 bereitet mir Kummer.
Grüße, stakkabo
-
Hallo. Besten Dank für eure Antworten.
Als Sektor eine ID zu verwenden ist mir leider nicht möglich, da der Code mit einem <div>-Tag von Joomla so generiert wird.
background-image: habe ich auch mal versucht, hat aber leider nichts gebracht.
Gibt es eventuell noch andere Möglichkeiten. Noch mal: der Kram funktioniert in Firefox einwandfrei, nur der IE 6 bereitet mir Kummer.
Grüße, stakkabo
Hallo,
mach einfach in der htm aus jedem "lass" ne class, geb der letzten Überschrift in .moduletable-NavMenu3 h3{ ..} vielleicht nicht gerade weiss als Farbe mit und auch die wird wieder sichtbar. Bei .moduletable-NavMenu2 h3{ ...} steht noch nen "/", mach den raus. Dann sollte alles so aussehen wie du es brauchst.
PS: Kann mir eigentlich nicht vorstellen das das im FF jemals so funktionierte :P Was hast du für ne Version?
Gruß Jan
-
-
-
-
Hi,
.moduletable-NavMenu2 h3{
/background:url("../images/bild2.gif");Die Eigenschaft /background gibt es nicht.
cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Schreinerei Waechter
O o ostern ...
Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.