[Linus-s]

Hallo zusammen

Ich habe mir für meine Ebay-Auktionen ein kleines Tabellenlayout gebastelt, jedoch wird die Breite im Internet Explorer 7 und im Firefox unterschiedlich dargestellt, weil der FF das cellpadding zur Gesamtbreite dazurechnet und der IE hingegen nicht.
Hat jemand eine Ahnung, wie man dies beheben kann, sodass die Tabellen dann schlussendlich so wie sie aktuell im IE aussehen dargestellt werden?
Vielen Dank bereits im Voraus.

Gruss
Linus

<center><table border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed">
<tr>
<td width="960" height="80"><img src="http://img3.imagebanana.com/img/oybrc8je/testheader.png" width="960" height="80" alt="" border="0"></td>
</table>

<center><table border="0" cellspacing="0" cellpadding="4" style="table-layout:fixed">
<tr>
<td width="960" height="24" bgcolor="A9A9A9"><font face="Arial">


<!--TITEL//--><b>

Titel


</b></td>
</table>

<table border="0" cellspacing="0" cellpadding="10" style="table-layout:fixed">
<tr>
<td align="left" valign="top" width="540" bgcolor="F5F5F5" border="0">
<font face="Arial"><font size=2>


<!--TEXT//-->   

Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text


</p>
<td width="420" bgcolor="D3D3D3" border="0">
<center><font size=1>


<!--BILDER//-->

<img src="http://img3.imagebanana.com/img/v9k1k3zq/fotos.png" width="400" height="300" alt="" border="0"><br><br>

<img src="http://img3.imagebanana.com/img/v9k1k3zq/fotos.png" width="400" height="300" alt="" border="0"><br><br>


</td>
</table>

<center><table border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed">
<tr><td width="960" height="24" bgcolor="A9A9A9"></td></table>

[kingpomm]

Ich verstehe nur halbwegs, aber versuche mal, der Tabelle ne feste Breite zu geben.

[Schnubbie]

Erstmal würde ich deinen Höhen- und Breitenangaben einen richtigen Wert zuweisen, sprich width="960px" usw

[Linus-s]

Zitat (kingpomm: 24.07.2008, 19:24)

Ich verstehe nur halbwegs, aber versuche mal, der Tabelle ne feste Breite zu geben.

Die Tabelle hat bereits eine feste Breite, das Problem ist nur, dass der FF den Innenabstand noch dazu zählt

Zitat (Schnubbie: 24.07.2008, 19:32)

Erstmal würde ich deinen Höhen- und Breitenangaben einen richtigen Wert zuweisen, sprich width="960px" usw

Danke für den Tipp, jedoch ändert dies leider auch nichts daran.

[F481]

Ja, aber du kannst dir sicher sein dass Firefox die Tabelle richtig anzeigt. Das Problem liegt also am IE.

[kingpomm]

Kannst ja ne Browserweiche verwenden. Also für Firefox kannst Du dann z.B. css1.css laden, für Internet-Explorer css2.css und dann noch eine Standard-CSS für den Rest der Seite.

[Diewie]

Oder machs einfach ohne Tabellen. Ich hab dir mal ein Div Layout entworfen, das etwa deiner Tabellenvorgabe entspricht. Ich habe die Schriftgrößen auf relative Größen verändert, um etwas mehr Barrierefreiheit zu gewährleisten. Das kannst du jedoch ändern wie du willst.

<div style="margin: auto; width: 960px; height: 80px; background-image: url(http://img3.imageban.../testheader.png)"></div>
<div style="margin: auto; width: 960px; height: 1.4em; background-color: #A9A9A9; font-family: Arial, Helvetica, sans-serif; text-align: center; line-height: 1.35em; font-weight: bold; font-size: 1.2em">Titel</div>

<div style="margin: auto; width: 960px; font-family: Arial, Helvetica, sans-serif; font-size: 0.9em;">
<div style="width: 540px; float: left;"><p style="margin: 0.5em; font-size: 0.92em;">Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text</p></div>
<div style="width: 420px; background-color: #D3D3D3; float: right; text-align: center; padding-top: 10px; padding-bottom: 10px; line-height: 1.15em; font-size: 0.8em;">
<img src="http://img3.imagebanana.com/img/v9k1k3zq/fotos.png" width="400" height="300" alt="" border="0" /><br />Bildunterschrift<br /><br />
<img src="http://img3.imagebanana.com/img/v9k1k3zq/fotos.png" width="400" height="300" alt="" border="0" />
</div>
</div>

<div style="margin: auto; width: 960px; height: 1.4em; background-color: #A9A9A9; font-family: Arial, Helvetica, sans-serif; text-align: center; line-height: 1.3em; font-weight: bold; font-size: 1.2em; clear: both"></div>

Gruß,
Stefan

[Linus-s]

Vielen Dank für deine Hilfe

Jetzt funktioniert eigentlich alles, ausser dass sich die Höhe des Textbereichs nicht mehr automatisch dem Bereich mit den Bildern anpasst.

Gruss
Linus

[Linus-s]

Ich habe es jetzt so gelöst, dass ich bei den beiden Tabellen in der Mitte die Breite in Prozent angegeben habe, dann funktioniert es sowohl im FF als auch im IE ohne grössere Probleme.

Danke nochmal an alle, die mir Tipps gegeben haben.

Gruss
Linus