CSS für Tabelle in IE und Firefox

Computer: Software & Programmierung HTML & CSS
#1

Hallöchen Forum…

Ich habe eine Webseite, die im IE korrekt angezeigt wird, aber im Firefox
werden die Texte auf den Bildern versetzt angezeigt.
Hier mal ein Screenshot:
anzeige im IE: http://s8.directupload.net/images/080805/zzov9q96.jpg
anzeige im FF: http://s8.directupload.net/images/080805/5hh632q5.jpg

Die Style-Angaben für orte und orteplz sieht so aus:

#orteplz
{ font-family:verdana,arial; font-size:10pt; font-style:normal; color: #000000; font-weight:normal; text-align: center; }

#orte
{ font-family:verdana,arial; font-size:18pt; font-style:normal; color: #000000; font-weight:normal; text-align: center; }

Und der Quelltext der Datei so:

<?php $zaehler = 0;
while($row = mysql\_fetch\_array($result)) { $zaehler = $zaehler + 1; if ($zaehler { ?\> =$row[ortname]?\> PLZ =$row[plz]?\> } else { ?\> =$row[ortname]?\> PLZ =$row[plz]?\> $zaehler = 1; } } ?\> Der php-code dazwischen stört Euch hoffentlich nicht, es ist ja ein reines html-oder css-Problem. Wäre schön wenn mir jemand sagen könnte, wie ich das coden muss, damits in beiden browsern gleich aussieht... lg micha
#2

Hallöchen Forum…

Ich habe eine Webseite, die im IE korrekt angezeigt wird, aber
im Firefox
werden die Texte auf den Bildern versetzt angezeigt.

nein es wird korrekt im FF angezeigt, der IE macht die probleme, ergo lerne konformen Code dannach anpassen an IE merkwürdigkeiten.

#3

nein es wird korrekt im FF angezeigt, der IE macht die
probleme, ergo lerne konformen Code dannach anpassen an IE
merkwürdigkeiten.

Prima antwort… Hat mir sehr geholfen :frowning:

#4

nein es wird korrekt im FF angezeigt, der IE macht die
probleme, ergo lerne konformen Code dannach anpassen an IE
merkwürdigkeiten.

Prima antwort… Hat mir sehr geholfen :frowning:

Aber nur so kommst du zum erfolg, weil der IE macht unsinn, ergo musst du damit klarkommen .

Die seite an FF anzupassen wird wohl schwieriger werden als andersrum, weil IE ist nicht dokummentiert HTML CSS hingegen schon.

Oer du lernst halt erstmal alle maken vom IE und wie man sie ausbügelt.

#5

vielleicht hiflt dir das http://archive.webstandards.org/css/winie/

seit dem mach ich nur noch für HTML conforme Browser danach erst für das schlechteste Browser programm.

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

#6

Und der Quelltext der Datei so:

Sowohl das Width- als auch das Height-Attribut werden vom W3C in TD- und TH-Elementen missbilligt.

http://www.w3.org/TR/html401/struct/tables.html#adef-width-TH

Ein Browser tut also gut daran, sich nicht an solche Attribute zu halten. Eine Zentrierung in einer Tabellenzelle, die ein Browser so breit machen darf, wie er will, ist aber nun mal witzlos. Definiere Weiten und Höhen in den Tabellenzellen stattdessen über CSS und alles wird gut!

Gruß Gernot

#7

Hallo Gernot

Definiere Weiten und Höhen in den Tabellenzellen
stattdessen über CSS und alles wird gut!

Vielen Dank, das hat mir geholfen.
Ich habs jetzt mit css so gelöst:

td.home { 
 height:200; 
 width:132; 
 vertical-align: middle;
 text-align: center;
 background-image:url(images/site/ort.gif); 
 background-repeat:no-repeat;
 background-position: 50% 50%; }

Vielen Dank und lg Micha

#8

Mit erschrecken gerade festgestellt:

td.home { 
 height:200; 
 width:132; 
 vertical-align: middle;
 text-align: center;
 background-image:url(images/site/ort.gif); 
 background-repeat:no-repeat;
 background-position: 50% 50%; }

Wenn ich das so definiere, passt es nun zwar bei FF, aber nun zickt der IE rum. Benötige ich da evtl eine doppelcodierung (browserweiche) oder gibts einen code, den beide korrekt anzeigen???

danke für eure Mühe lg micha

#9

Mit erschrecken gerade festgestellt:

td.home {
height:200;
width:132;
vertical-align: middle;
text-align: center;
background-image:url(images/site/ort.gif);
background-repeat:no-repeat;
background-position: 50% 50%; }

Wenn ich das so definiere, passt es nun zwar bei FF, aber nun
zickt der IE rum. Benötige ich da evtl eine doppelcodierung
(browserweiche) oder gibts einen code, den beide korrekt
anzeigen???

Das wundert mich, denn eine Angabe zu width und height ohne Maßeinheit müsste der Firefox als strenger Browser unerbittlich ignorieren.

Außerdem hast du in deinem TABLE-Element auch eine Width-Angabe von -ich glaube mich zu erinnern- 80%!

Wie soll sich der Browser entscheiden, wenn bei deinen beiden enthaltenen Tabellenzellen zwei mal 132 em, en, px, pt oder mm nicht 80% der zur Verfügung stehenden Breite ergeben?

Angaben zur Gesamtweite einer Tabelle gleichzeitig mit Angaben zur Weite einzelner Zellen/Spalten mache ich eigentlich immer nur, wenn eine Zelle/Spalte als Puffer keine Weitenangabe bekommt bzw. in mindestens einem COL-Element „width="*"” steht.

Wenn du darüber hinaus ganz sicher gehen willst, dass die Tabellenzellen sich strikt an die vorgebene Weite halten und nicht je nach Inhaltsmenge davon abweichen und du mit Pufferzelle/spalte jeden Konflikt vermeidest, kannst du deinem TABLE-Element auch noch

table-layout:fixed;

verpassen. Das solltest du aber auch wirklich nur dann tun.

Gruß Gernot

#10

Hallo Gernot

Ich hab mir mal Deine Ratschläge zu Herzen genommen und das ganze abgeändert.

td.home { 
height:200px; 
width:132px; 
vertical-align: middle;
text-align: center;
background-image:url(images/site/ort.gif); 
background-repeat:no-repeat;
background-position: 50% 50%; }
<?php $result = mysql_query("SELECT * FROM tbl_orte ORDER BY ortname ASC;");<br />?\>
<?php $zaehler = 0;
while($row = mysql\_fetch\_array($result)) { $zaehler = $zaehler + 1; if ($zaehler\<=2) { ?\>=$row[ortname]?\> PLZ =$row[plz]?\> } else { ?\> =$row[ortname]?\> PLZ =$row[plz]?\> $zaehler = 1; } } ?\> Das ist meine Komplettversion der Datei. Die Tabellenbreite ist nun ohne Wert, aber das stört den IE überhaupt nicht. Auch wenn ich einen Wert angebe (100%) ändert sich nix, genausowenig wie wenn ich tabl-layout: fixed verwende. Der IE zeigt den Text in den Spalten zu weit links an.. Ich werd nochmal wahnsinnig mit der formatierung :smiley:... lg micha