CSS-Unterschiede FF und IE

Computer: Software & Programmierung HTML & CSS
#1

Hallo,
ich hoffe hier kann mir jemand weiterhelfen.
Die Seite
http://www.vfb-alemannia-pfalzdorf.de/prev03/soccer/…
wird leider nicht wie gewünscht im Firefox bzw. Internet Explorer angezeigt.

Der Abschnitt „Trainingszeiten“ wird im IE ‚korrekt‘ angezeigt, also

Tag... Uhrzeit
Tag... Uhrzeit

Im FF ist die Anzeige ‚falsch‘

Tag
Uhrzeit
Tag
Uhrzeit

Im FF werden die Überschriften (Mannschaftsfoto, Trainer-/Betreuerstab etc.) blau unterstrichen, im IE leider nicht.

Mir ist bekannt das die CSS-Eigenschaften von beiden Browsern unterschiedlich interpretiert werden. Aber vielleicht kann mir jemand helfen, das es bei beiden wie gewünscht aussieht?

Die CSS sind unter http://www.vfb-alemannia-pfalzdorf.de/prev03/library…
Zugrunde liegen hier die CSS für die blau unterstrichenen Teile:
‚#content .category .headline‘

und für das Problem mit den Trainingszeiten:
‚#content .category .label .left .w8‘ bzw.
‚#content .category .label .w8‘

Getestet habe ich das ganze mit FF 1.5 und IE 6.0

Für Hilfe im voraus dankend

Marcel…

#2

Der Abschnitt „Trainingszeiten“ wird im IE ‚korrekt‘
angezeigt, also

Tag… Uhrzeit
Tag… Uhrzeit

Im FF ist die Anzeige ‚falsch‘

Tag
Uhrzeit
Tag
Uhrzeit

Das ist wohl ein Problem mit dem Textfluss und der Breitenberechnung und überhaupt. Floats sind ein lustiges Thema, und der IE bastelt einige Sachen, die so im Standard nicht unbedingt drinstehen. Das Zusammenspiel zwischen Positionierung und Floats ist einigermaßen komplex und da spielt noch die Breitenberechnung rein.

Generell: Thou shalt use more block elements…

Warum benutzt du für Überschriften nicht - oder zumindest div? Das selbe gilt für andere „semantische Blöcke“ und . SPAN ist eigentlich eher was für inline-Formatierungen, und du benutzt zuviel davon. Das verursacht wohl einige Probleme, weil (a) IE genau betrachtet kein CSS kann und weil (b) die Berechnung der Ausmaße aus dem Inhalt ein extrem witziges Thema ist.

#3

Hallo,
ich hoffe hier kann mir jemand weiterhelfen.
Die Seite
http://www.vfb-alemannia-pfalzdorf.de/prev03/soccer/…
wird leider nicht wie gewünscht im Firefox bzw. Internet
Explorer angezeigt.

Der Abschnitt „Trainingszeiten“ wird im IE ‚korrekt‘

dann macht der ie das aber falsch.

fuer die uhrzeit hast du kein .left definiert, also wird die als blockelement und damit als neuer absatz dargestellt. um den von dir geweunschten effekt richtig darzustellen, muesstest du fuer die uhrzeit ebenfalls class=„label left w8“ definieren und dann zw. den zeilen ein
einfuegen, dann wuerde es auch ohne css wieder halbwegs richtig dargestellt.

#content .label {
 display:block;
 padding-left:10px;
 }

#content .label.left {
 float:left;
 }

Dienstag19:00h - 20:30h
Freitag19:00h - 20:30h

sowas laesst sich in mozilla&co euberigens mit der webdeveloper toolbar recht gut debuggen, weil dann mit view style information und klick auf des interessante element direkt alle gueltigen kalssen dargestellt werden. sieht dann so aus: http://eoe-projekte.de/ClipBoard-1.png

#4

Hallo Nicos,

Floats sind ein lustiges
Thema, und der IE bastelt einige Sachen, die so im Standard
nicht unbedingt drinstehen.

Ja, das hab ich mittlerweile auch festgestellt, sehr ärgerlich

Warum benutzt du für Überschriften nicht -
oder zumindest div? Das selbe gilt für andere „semantische
Blöcke“ und . SPAN ist eigentlich eher was für
inline-Formatierungen, und du benutzt zuviel davon.

Danke für den Hinweis, werd das mal auf meine Liste setzten und bei der nächsten Überarbeitung in Betracht ziehen.

Vielen Dank nochmals und Gruß

Marcel

#5

Tach dog.je

Der Abschnitt „Trainingszeiten“ wird im IE ‚korrekt‘

dann macht der ie das aber falsch.

War zu erwarten *g*

fuer die uhrzeit hast du kein .left definiert, also wird die
als blockelement und damit als neuer absatz dargestellt. um

Mist, da isser der Fehler…

den von dir geweunschten effekt richtig darzustellen,
muesstest du fuer die uhrzeit ebenfalls class=„label left w8“
definieren und dann zw. den zeilen ein
einfuegen

Naja, zwar nicht grade schön, aber effektiv, danke dafür.

sowas laesst sich in mozilla&co euberigens mit der
webdeveloper toolbar recht gut debuggen, weil dann mit view
style information und klick auf des interessante element
direkt alle gueltigen kalssen dargestellt werden. sieht dann
so aus: http://eoe-projekte.de/ClipBoard-1.png

Ah, den kannte ich noch nicht, wird mir bestimmt bei so einigen Sachen weiterhelfen.

Besten Dank und Gruß

Marcel