background-position + FF zeigt BG-Bild bei H1 nicht an
Adrian
- css
Hallo!
Ich habe zwei Probleme, die ich selbst nach Archivsuche, mehrmaligen SelfHTML-Artikel Durchlesen und intensivem Code Debuggen nicht entfernen kann.
Ich habe eine XHTML-Seite geschrieben (noch auf localhost), bei der ich ganz normal eine Überschrift deklariert habe:
XHTML:
[...]
<h1>Stamm Ata Ulf</h1>
[...]
In der CSS-Datei (die aufgerufen wird, hier liegt nicht der Fehler) notiere ich folgendes:
CSS:
body {
margin: 0;
padding: 0;
background: #cde7f3 url('../pics/header_bg.png') repeat-x 37px 0;
color: #13138d;
font-size: 100.1%;
font-family: Arial, sans-serif;
}
h1 {
background-image: url('../pics/header_banner.png');
background-repeat: no-repeat;
height: 142px;
font-size: 0px;
color: #cde7f3;
margin: 0;
}
1. Problem: die Hintergrundgrafik des Body-Elements wird nicht herabgesetzt (auch nicht, wenn ich das separat in background-position: 37px 0px; notiere)
2. Problem: mein Firefox 2 zeigt die Hintergrundgrafik der Überschrift garnicht erst an... Sämtliche andere Browser (Opera 9.1, Netscape 7, MSIE 6) tun dies trotzdem.
Hinweis: Der Rest des XHTML-Codes ist vollständig richtig, damit habe ich schon viele andere Seiten geschrieben. Es liegt also nicht daran. (Ich sehe es auch nicht für nötig an, ihn mitzusenden, da er der Lösungsfindung nicht dient und nur Ballast darstellt.)
Ich hoffe, ihr könnt mir weiterhelfen...
Mit freundlichen Grüßen,
Adrian
Hallo!
Nach weiterem intensivem Code Debuggen ist es mir gelungen, den 1. Fehler zu beheben... *vor den kopf schlag*
Ich habe x- und y-Position lediglich vertauscht, jetzt passt es wieder.
Der 2. Fehler besteht nach wie vor und ich weiss nicht, wie ich ihn beheben soll...
Mit freundlichen Grüßen,
Adrian
CSS:
h1 {
...
font-size: 0px;
...
}
Kann es sein dass Mozilla bei Fontsize 0 (und zusätzlich keine Lineheight) das Ding einach 0 Pixel hoch macht bzw. \*beliebig\*/0 Pixel hoch (wegen der fehlenden Lineheight)?
Ich hatte jedenfalls schon komische Höhen bei Elementen wenn Fontsize und Lineheight nicht entsprechend dimensioniert waren.
Seitem gebe ich das immer entsprechend an.
Hallo!
Kann es sein dass Mozilla bei Fontsize 0 (und zusätzlich keine Lineheight) das Ding einach 0 Pixel hoch macht bzw. *beliebig*/0 Pixel hoch (wegen der fehlenden Lineheight)?
Ich hatte jedenfalls schon komische Höhen bei Elementen wenn Fontsize und Lineheight nicht entsprechend dimensioniert waren.
Also mein aktueller Quelltext (inklusive Line-height) lautet wie folgt:
CSS:
[...]
h1 {
background: transparent url('../pics/header_banner.png') no-repeat left top;
height: 142px;
width: 665px;
font-size: 1px;
color: #cde7f3;
margin: 0;
text-align: center;
line-height: 1px;
}
[...]
Es funktioniert aber immer noch nicht.
Mittlerweile habe ich herausgefunden (mit dem DOM-Inspektor), dass der Firefox automatisch display: none; hinzufügt, warum auch immer. Ich habe es selbst mit dem Bild selbst in der Überschrift (also img) versucht. Es klappt garnichts...
Ich finde das sehr komisch.. :-S
Mit freundlichen Grüßen,
Adrian
Hello out there!
background: transparent url('../pics/header_banner.png') no-repeat left top;
[…] dass der Firefox automatisch display: none; hinzufügt, warum auch immer.
Wegen dem Dateinamen doch nicht etwa? "banner" heißt Spam heißt 'display: none'.
Nur so ’ne Vermutung.
See ya up the road,
Gunnar
Hallo!
[…] dass der Firefox automatisch display: none; hinzufügt, warum auch immer.
Wegen dem Dateinamen doch nicht etwa? "banner" heißt Spam heißt 'display: none'.
Nur so ’ne Vermutung.
Die Vermutung war verdammt gut!
Vielen Dank für diesen Einfall, jetzt funktionierts. Der Spamentferner im FF hat das Bild automatisch nicht angezeigt... Naja gut, Notiz für die Zukunft: Nie wieder irgendwas mit "banner" belegen. *lol*
--> Problem behoben
Mit freundlichen Grüßen,
Adrian