firefox vs. ie in html-programmierung

[alleswarschonbelegt]

hallo zusammen

ich bräuchte etwas hilfe bzgl. style-kram in bezug auf html-programmierung.

vielleicht weiss einer von euch bescheid

ich verwalte die website des turnverein frankenstein (das ist in der schönen pfalz :cool: ) und habe auferlegt bekommen, doch mal wieder etwas am design zu machen. doch bei der ausführung bin ich auf ein prob gestossen, wo es unterschiede in der ausführung des html-codes gibt, den ich programmiert habe.

wenn man sich den u.g. link mittels firefox anschaut, sieht alles so aus, wie gewollt, sprich die grauen boxen links und rechts gehen bis nach unten durch. mit dem ie hören die boxen dort auf, wo auch der text aufhört. und das, obwohl ich den boxen gesagt habe, sie sollen "0" vom "bottom" weg sein.

der quell-code sieht so aus (steht genau so in einer css-datei, die ich in die html-datei reinhole)

<style type="text/css">

<!--

body { }

#box1 { position:absolute; top:0px; bottom:0px; left:0px; width:180px; z-index:1; }

#box2 { position:absolute; top:0px; bottom:0px; right:0px; width:180px; z-index:1; }

-->

</style>

im html selbst werden die boxen dann so aufgerufen:

<div id="box1" align="left" style="background:lightgrey">

bzw.

<div id="box2" align="right" style="background:lightgrey">

das ganze ist einsehbar via

http://www.tv-frankenstein.de/neu/

weiss einer, wie ich den code anpassen muss, damit es im ie und im firefox gleich aussieht? die site muss unbedingt ie-kompatibel sein. gibt ja immer noch genug unverbesserliche, die den benutzen...

ich hoffe, dafür gibt es eine einfache lösung, sonst muss ich wieder von vorne anfangen...

danke norman

ps: php-kram kommt nicht in frage, das kann ich nur in ansätzen.

:schlaf:

[etherius]

Wie wäre es mit

#box1 { 

position:absolute; 

top:0px; 

bottom:0px;

left:0px; 

width:180px; 

[B]height:100%;[/B]

z-index:1; }

[alleswarschonbelegt]

omg, da hätt ich auch selber draufkommen können.

was ich alles ausprobiert hab und da tuts ein height...

danke @etherius

[etherius]

np *vollmüllweilsonstdasforummeckert*

[geloescht_JesterDay]

ich bräuchte etwas hilfe bzgl. style-kram in bezug auf html-programmierung.

vielleicht weiss einer von euch bescheid

ich verwalte die website des turnverein frankenstein (das ist in der schönen pfalz :cool: ) und habe auferlegt bekommen, doch mal wieder etwas am design zu machen. doch bei der ausführung bin ich auf ein prob gestossen, wo es unterschiede in der ausführung des html-codes gibt, den ich programmiert habe.

[besserwisser]

HTML ist keine Programmiersprache, also kann man HTML 1. nicht programmieren und 2. wird HTML-Code auch nicht ausgeführt

HTML ist eine Dokumetnenbeschreibungssprache und als solche wird sie von einem entspr. Client interpretiert und das damit beschriebene Dokument angezeigt.

[/besserwisser]

Dann zu deinen Seiten: Damit eine einigermaßen Gleichbehandlung zwischen aktuellen Browsern zustande kommt, muss vorallem der HTML-Code valid sein. Bei dir fehlt z.B. überall der Doctype. Browser gehen dann in den Quirks-Mode (da nicht vorgegeben wurde, was da eigentlich in der Seite steht), d.H. es wird alles nach bestem Wissen und Gewissen versucht irgendwie anzuzeigen. Dabei muss es sich aber nicht um eine standardgemäße Anzeige handeln, weil auf die Art auch inkompatibilitäten älterer Browser auch in neuen Versionen "konserviert" wurden.

Also erstmal einen Doctype auf jede Seite.

http://de.selfhtml.org/html/allgemein/grundgeruest.htm#dokumenttyp

Dann zu deinem CSS: Da du die Boxen mit position: absolut; left/right: 0 schon links bzw. rechts positionierst, kannst du dir das align left/right ja auch sparen. Im Endeffekt macht es wohl keinen Unterschied, ist aber einfach sauberer.

Ausserdem mixt du (fast) alle Möglichkeiten, CSS auf der Seite einzubeinden

1. hast du 2 externe Stylesheets, ind enen du ja die Boxen "gestylt" hast.

2. haben die dann auf der Seite noch einen weiteren style

und 3. benutzt du für das align dann wieder kein CSS.

Und ausserdem ist es eine wilde Mischung aus Layouttabellen und CSS.

So, das war erstmal alle Kritik (bitte nicht zu persönlich nehmen o.ä.).

[SNOWMAN]

jap, da stimm ich jesterday zu.

entweder alle stylesachen in ne css oder direkt zum htmlelement dazu.

des weiteren:

wenn du nun bottom und height drinstehen hast is das nich grad gut, entscheide dich da lieber für eins (also hau bottom ruas und lass height drin )

das könnte ggf. zu problemen führen, nicht unbedingt bei IE oder FF aber vllt. bei Moz oder safari oder sonstwelchen, denn auf der einen seite sagst du ihm, er soll X hoch (height) sein, auf der anderne sagst du er soll bis zum boden gehen (bottom).

[alleswarschonbelegt]

danke für die tipps bzw. kritik. ich nehm davon nix persönlich, mach es eh wie ich's will bzw. wie ich am besten damit zurecht komme.

doctype werd ich noch einbauen, ich wusste nicht, dass der so wichtig sein kann. das mit den mehreren style-sheets hab ich deshalb gemacht, damit ich unterscheiden kann, in welchen frame welcher sheet eingebunden ist. ansonsten nochmal danke an alle für die tipps zur verbesserung des codes, ich werd einiges davon übernehmen.

:nett:

[Mascha]

Als andere Idee: Mach den Hintergrund komplett grau und nur den Mittelteil weiß.