Hi folks!
Tja, heute mal so rum: Da ich meine Seiten primaer fuer den lieben Herrn Netscape entwickel, habe ich hinterher meine Probleme, sie an den boesen IE anzupassen. (Das nur als Hinweis fuer die Netscape-Hasser-Fraktion - es kommt also oft einfach nur drauf an, auf welcher Seite man beginnt.)
Da waere also eine Seite, die ich mal nach http://www.geocities.com/SiliconValley/Lakes/1458/__foo/self_forum/elodia.html hochgeladen habe. Sie enthaelt die Liedtexte einer CD, jeweils in Deutsch (original) und Englisch (Uebersetzung). Ich moechte nun die gesamte Seite insgesamt zentriert ausgerichtet haben, jedoch die deutschen Texte mehr auf der linken Seite und die englischen mehr auf der rechten. Dazu verwende ich DIVs wie folgt:
<DIV CLASS="poem">
<DIV CLASS="poemorig">
<P CLASS="poemverse">
Hier eine Strophe in der Originalsprache (meist Deutsch)
</P>
<P CLASS="poemverse">
Noch eine Strophe
</P>
</DIV>
<DIV CLASS="poemtrans">
<P CLASS="poemverse">
Strophe der Uebersetzung (Englisch)
</P>
</DIV>
</DIV>
Die Ausrichtung sollen folgende CSS-Statements besorgen:
div.poem {
width:80%;
border:solid 1px red; margin-bottom:1cm; padding-top:0.5cm; padding-bottom:0.5cm;
page-break-after:always;
text-align:center;
}
div.poemorig {
width:80%;
border:solid 1px blue; margin-bottom:0.5cm;
text-align:left;
}
div.poemtrans {
width:80%;
border:solid 1px blue; margin-top:0.5cm;
text-align:right;
}
p.poemverse {
font-family:"Times New Roman"; font-size:10pt; font-style:italic;
text-align:center;
}
Ein Lied (poem) soll also in einer DIV Platz finden, die 80% der Breite des Fensters einnehmen darf und dort zentriert ist. Innerhalb dieser DIV sind zwei weitere DIVs, jeweils 80% der Parent-DIV breit. Die eine, die den Text in der Originalsprache enthaelt (poemorig), soll am linken Rand der Parent-DIV kleben, die andere am rechten. Innerhalb jeder der beiden Child-DIVs gibt es nun ein paar Strophen (poemverse), deren Text wieder zentriert ausgerichtet ist. Das klappt mit dem Netsi auch ganz gut, nur der IE will halt nicht.
Der IE richtet die poem-DIV linksbuendig im Fenster aus, alles was drin ist, ist innerhalb dieser grossen DIV zentriert. Fast scheint es so, als wuerde der IE die text-align-Angabe nur auf den Inhalt einer DIV beziehen, nicht jedoch auf die DIV selbst. Das kann's jedoch auch nicht ganz sein, denn dann muessten ja die einzelnen Strophen zumindest innerhalb der Child-DIVs links- bzw. rechtsbuendig ausgerichtet sein; sie sind jedoch zentriert. Trotzdem funktioniert ein Workaround fuer den IE, bei dem jede DIV nochmal in eine DIV gesteckt wird, die dasselbe Ausrichtungsattribut erhaelt. Die poem-DIV wird also durch eine weitere DIV mit dem Style-Attribut text-align:center umhuellt. Ich habe das mal an dem ersten Lied demonstriert.
So weit so gut. Nee, eigentlich schlecht, ich hab naemlich keinen Bock, mir wegen dem IE meinen ganzen huebschen Code zu versauen. Eigentlich koennte er mir ja egal sein, aber ich habe vor, diese Seite auszudrucken und dabei die CSS-Angabe page-break-after zu verwenden - und die kann der Netsi nun wieder nicht.
Naja, und nun meine Frage: Kriege ich dieses Layout auch ohne die ganzen surroundenden DIVs fuer den IE hin?
Uebrigens, was ich hier quatsche beziehe ich alles auf die Versionen Netscape 4.08 und IE4.72 (jedenfalls steht das in der Versionsangabe).
Wer sich des Problems intensiver annehmen moechte, kann sich statt der HTML-Datei die [http://www.geocities.com/SiliconValley/Lakes/1458/__foo/self_forum/elodia.zip] runterziehen, die enthaelt dann den GeoCities-Werbemuell nicht.
Thanx for listening and hopefully for solution, Calocybe