Firefox und CSS

Ali Jox

Hallo ihrs!

Also auf Anraten von Freunden habe ich (eingefleischte IE Nutzerin) mir den Firefox vor kurzer Zeit runter geladen (gerade auf 1.0.7 upgedated). ABER leider scheint FF kaum CSS interpretieren zu können.

Im Moment baue ich eine neue Webseite, ich halte mich da eigentlich imemr an sehr einfache Mittel. Iframes, Tabellen, kaum JavaScripts, aber CSS ist ein wichtiges Stilmittel dabei. Auch im zugehörigen Forum.. Und da habe ich jetzt festgestellt, dass das Forum unter FF schauerhaft aussieht.

http://35421.rapidforum.com Die ganzen Areas sollten eigentlich auch dunkelblau sein, wie der Hintergrund (der weil Bild übrigens fixiert sein sollte). Kurzum, ich finds total schade, dass FF nicht mal die einfachsten CSS zu kennen scheint. Na ja, vielleicht in späteren Versionen. Hoffentlich.

Ach ja http://elisabeth.booby.at ist die zugehörige Homepage zum Forum. Aber da sind die Unterschiede zum IE nicht sooo gravierend. Im IE sieht das Menü besser aus, weil zwischen der Grafik mit jeweiligen Menü Überschrift und dem Tabellenfeld mit den einzelnen Punkten ein kleiner Abstand gelassen wird.

In meinem anderen Forum siehts leider ganz ähnlich aus http://16253.rapidforum.com Da frage ich mich nur, warum es bei http://20697.rapidforum.com eigentlich passt. Das war/ist mein erstes Forum, und es basiert auf genau dem gleichen Rapidforum Skin wie die anderen beiden *kopfkratz*

brain

Für gewöhnlich ist es so, dass der FF wesentlich besser mit CSS-Angaben umgeht als der IE. Wenn du viele Websites schreibst wirst du das schnell merken, insbesondere wenn es das Box-Modell mit Positionierungen, Breiten, Margins, Paddings etc. angeht.
Das Problem auf deiner Site ist imo, dass der FF die background-color-Angabe für die Tabelle (TABLE.tabelle {irgendwas}) "höher bewertet" als die Farbangaben für die einzelnen Zellen. Ob das korrekt ist oder nicht weiß ich jetzt nicht, müsstest du mal auf http://www.w3.org in der CSS 2.1-Spezifikation nachlesen. Um das Problem zu beheben könntest du mal versuchen, der Tabelle keine Hintergrundfarbe zuzuweisen, möglicherweise geht es dann.
Oder aber es hat was mit der Farbangaben-Interpretation zu tun, damit hatte ich auch schon ab und an Probleme, weiß aber nicht mehr genau was die "Experten" dazu meinten...

Hernals

Vielleicht ist "Elisabeth" schuld, aber ich habe Deinen Code nur schnell einmal mit tidy geprüft, hier ein "Best of"

Zeile 1 Zeichen 1 - Warnung: missing <!DOCTYPE> declaration
Zeile 2 Zeichen 51 - Warnung: '<' + '/' + letter not allowed here
Zeile 2 Zeichen 276 - Warnung: '<' + '/' + letter not allowed here
Zeile 15 Zeichen 1 - Warnung: discarding unexpected <html>
Zeile 3 Zeichen 10 - Warnung: <head> isn't allowed in <body> elements
Zeile 3 Zeichen 10 - Warnung: <title> isn't allowed in <body> elements
Zeile 3 Zeichen 10 - Warnung: <style> isn't allowed in <body> elements
Zeile 3 Zeichen 10 - Warnung: </head> isn't allowed in <body> elements
Zeile 127 Zeichen 1 - Warnung: discarding unexpected <body>
Zeile 132 Zeichen 46 - Warnung: missing </font> before </td>
Zeile 148 Zeichen 125 - Warnung: unescaped & or unknown entity "&id"
Zeile 148 Zeichen 43 - Warnung: missing </font> before </td>
Zeile 149 Zeichen 44 - Warnung: missing </font> before </td>
Zeile 164 Zeichen 33 - Warnung: missing </font> before </td>
Zeile 163 Zeichen 1 - Warnung: plain text isn't allowed in <tr> elements
Zeile 188 Zeichen 1 - Warnung: discarding unexpected </td>
Zeile 188 Zeichen 6 - Warnung: discarding unexpected </tr>
Zeile 188 Zeichen 384 - Warnung: missing </font> before </td>
Zeile 217 Zeichen 74 - Warnung: unescaped & or unknown entity "&id"
Zeile 223 Zeichen 29 - Warnung: unescaped & or unknown entity "&id"
Zeile 231 Zeichen 1 - Warnung: discarding unexpected </td>
Zeile 231 Zeichen 6 - Warnung: discarding unexpected </tr>
Zeile 231 Zeichen 378 - Warnung: missing </font> before </td>

DasIch

1. Wenn es einen Browser gibt der schlecht mit CSS umgeht dann ist es der IE. Der Fx ist in Sachen CSS einer der besten. Wenn die Seite allerdings nicht valid ist oder bestimmte Fehler enthält interpretiert die Fx die Sachen anders als der IE. Was allerdings nicht zeigt das der Fx schelchter ist zeigt eher das der Fader des IE so ziemlich alles erlaubt und teilweise auch umgeht oder anders darstellt.

HaMF

Zitat

<style type="text/css">
<!--
BODY {font-family:Verdana,Arial,Helvetica; text-decoration:none;}
TABLE.tabelle {background-color:#30357A;}
TABLE.tabrahmen {background-color:#30357A; BORDER-RIGHT: #A0A6D8 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: #A0A6D8 1px solid; PADDING-LEFT: 1px; PADDING-BOTTOM: 1px; BORDER-LEFT: #A0A6D8 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #A0A6D8 1px solid;}
TD.helloben {background-color:#30357A;}
TD.pn {background-color:#01003C;}
TD.forumname {{background-color:#01003C; color:#FFFFFF;}
TD.forumname2 {background-color:#01003C;}
[...]

Alles anzeigen

Mach mal das zusätzliche { da weg, vielleicht wirds dann besser... :roll:

Erklärend dazu: Dem IE ist sowas scheiß egal, aber wenn du willst, dass der Fx CSS richtig interpretiert, dann solltest du dir dein CSS erst mal validieren lassen. Dabei kommen dann allerdings noch mehr Fehler (und besonders Warnungen) zutage.

Gruß Hannes

Ali Jox

@ HaMF: daaaaaaanke!!! *demütigverbeug* an der einen Klammer lags. Ich glaub da hätt ich mich dumm und dämlich gesucht *lala* Kann mich gar nicht daran erinnern dort was bearbeiter zu haben... na ja von selber kommt der Fehler ja wohl nicht rein.

was anderes.. warum fixiert der FF denn die Hintergrundbilder nicht? Das ist doch nur ein einfaches Attribut vom body Tag. bgproperties="fixed"...

wupperbayer

Hmm... bgproperties hab ich noch nie gehört, wüsste auch nicht, dass das Standard ist.

"position:fixed" als CSS-Attribut beim Hintergrundbild hift aber imho

HaMF

warum dieser IE-Schund so verbreitet ist? *amkopfkratz*

Zitat von "<a href=\"http://de.selfhtml.org/html/dateiweit/hintergrundbild.htm#\">Selfhtml</a>"

Der Internet Explorer kennt ein zusätzliches Attribut bgproperties="fixed" im einleitenden <body>-Tag, mit dem Sie ein unbewegliches Hintergrundbild erzeugen können. Dieses Attribut gehörte jedoch nie zum HTML-Standard und lässt sich auch durch eine CSS-Angabe ersetzen, z.B. so:
<body style="background-image:url(background.jpg); background-attachment:fixed;">

Gruß Hannes

wupperbayer

Na, dann eben so... :roll: Müsste mal wieder mein Wissen auffrischen...

HaMF

war nicht als kritik an dir gedacht, wollte nur aus selfhtml zitieren

wupperbayer

Das weiß ich, dass du nur Selfhtml zitiert hast... das war mehr Selbstkritik

Schön, dass wir uns so gut verstehen

HaMF

Zitat von wupperbayer

Schön, dass wir uns so gut verstehen

Freut mich auch

Fraggle

Ali Jox:
Meinst Du die Hintergrundgrafik mit css fixieren?
Dann so:

Code

background: url('images/background.gif') repeat-y fixed;

Edit: repeat ist in Deinem Fall natürlich wohl nicht nötig, es war bei mir nur ein Balken der gefixt und wiederholte auftreten sollte um das ganze Bild zu füllen.