Line Break im Code = Line Break in IE?

thrasher

Hallo!

Bin gerade am Testen meiner Webseite in IE, da sie für Firefox optimiert wurde und da auch gut aussieht. Dabei ist mir die nervige Angelegenheit aufgefallen, dass in IE7 überall da, wo im Code ein Zeilenumbruch ist, im IE ein Abstand ist! In Firefox ist das natürlich nicht der Fall.

Im einfachen Beispiel:

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Untitled Document</title>
  </head>


  <body>
    <table cellpadding="0" cellspacing="0" border="0" witdh="100">
      <tr>
        <td>
          <img src="image1.jpg" width="100" height="20"/>
          <img src="image2.jpg" width="100" height="20"/>
        </td>
      </tr>
    </table>
  </body>
</html>

Alles anzeigen

sollten in Firefox zwei Grafiken direkt übereinander angezeigt werden. In IE7 ist aber ein Zeilenabstand dazwischen

Wenn man die beiden img-tags in die selbe Codezeile stellt, wird's in beiden richtig angezeigt...

Im konkreten Fall gehts um eine zusammengesetzte Grafik, wo die Positionierung also Pixelgenau sein muss

Vielleicht kann mir jemand bei diesem nervigen Problem helfen, kann eigentlich nix kompliziertes sein, oder? :confused:

LG Robert

MarvinTheRobot

nein ist auch nicht kompliziert, wenn du schon mit tables arbeiten musst mach einfach eine zweite tabellenzelle für die graphik 2 - also

Code

<td>
          <img src="image1.jpg" width="100" height="20"/>
</td>
<td>
          <img src="image2.jpg" width="100" height="20"/>
</td>

Dann klappts auch mitn IE - allerdings rat ich dazu vom designen mit tables abzusehn Divs sind more sexy

samyjr

Zitat von MarvinTheRobot

nein ist auch nicht kompliziert, wenn du schon mit tables arbeiten musst mach einfach eine zweite tabellenzelle für die graphik 2 - also

ich glaub er will die grafiken übereinander => <tr> table row

Code

<td>
          <img src="image1.jpg" width="100" height="20"/>
</td>
[size=12][B]</tr>
<tr>
[/B][/SIZE] <td>
          <img src="image2.jpg" width="100" height="20"/>
</td>

mikegr

Falls die Graphik in einer Tabellenzelle sein soll, tut's ein br-Tag auch.

Code

<td>
     <img src="image1.jpg" width="100" height="20"/> [COLOR=Red]<br/>[/COLOR]
     <img src="image2.jpg" width="100" height="20"/>
</td>

Wenn du aber nur wegen der Positionen der Graphiken eine Tabelle einführst, da ist div die eindeutig bessere Wahl.

MarvinTheRobot

Zitat von samyjr

ich glaub er will die grafiken übereinander

ahrgl -> definetly not my day: "Today, 08:34"

natürlich übereinander, ich hab das total überlesen *g* - oh mein kaffee, rette mir den tag

samyjr

mir ist es ähnlich ergangen, hab zuerst gedacht, das er sie nebeneinander will und er die table width auf 100 gestellt hat und die beiden grafiken JEWEILS 100 breit sind: das geht wohl nicht ... dann hab ich sein posting GENAU gelesen und dann deins und dann war ich total verwirred ...

thrasher

Danke für die Antworten, sorry wenns ich mich etwas verwirrt ausgedrückt habe.
Das Problem ist nicht der Zeilenumbruch bzw. das untereinander Positionieren, das ist mir schon klar wie's funkt
Das Problem ist, dass IE oft einen vert. Abstand zwischen den Elementen hat wo Firefox keinen hat

Konkret geht es mir um folgendes:

PHP

<table border="0" cellspacing="0" cellpadding="0" height="600">
        <tr>
            <td valign="top" align="left" height="20" colspan="2">
                <img src="corner.gif" height="20" width="20" border="0"/></td>
        </tr>
        <tr>
            <td valign="top" align="left" height="600" width="20">
                <img border="0" src="borderexpanded.gif" height="600" width="20" />
            </td>
            <td valign="top" align="center" height="600">
            <?php
                include('Output.php');
                Output::printAdspaceContent();
            ?>
            </td>
        </tr>
    </table>

Alles anzeigen

Also das Resultat sollte eine durchgehende Grafik links sein, rechts davon wird der Inhalt mittels PHP generiert. In FF ist sie durchgehend, in IE7 nicht. (Beispiel ist hier zu sehen)

Wenn ich den </td> Tag direkt nach der Grafik setze, also keine Tabulatoren oder Zeilenumbrüche, funktionierts bei beiden (siehe hier).

Daher meine Annahme, IE würde den Code zwischen den Tags anders parsen als FF und es gäbe einen Weg ihm mitzuteilen, Whitespaces und Newlines im Sourcode zu ignorieren... Weil der Codelesbarkeit dient sowas nicht gerade

Jetzt besser dargestellt?

Jetzt mitmachen!