Sebastian: text float bei IE

Beitrag lesen

hallo alle samt

habe ein kleines problem mit dem IE und einer der layoutvorlagen um es genau zu sagen mit dieser hier: "http://de.selfhtml.org/layouts/nr10/index.htm"

undzwar funktioniert bei mir im IE der textfluss nicht so wie er es soll. ich hab mal einen sreenshot gemacht wie es bei mir mit dem IE aussieht:
http://www.geocities.com/doublekill2003/h1.jpg

im firefox browser wird es ganz normal angezeigt d.h der text reicht bis zur trennlinie! am html code oder den css dateien habe ich nichts verändert auf dem bild zu sehen ist die originaldatei wie man sie runterladen kann. hatte die frage auch schon per e-mail an einen der admins (Mathias Schäfer) geschickt und bekam volgenden lösungsvorschlag und einen kommentar das es bei ihm ohne probleme funktiniert:

"Ich vermute folgenden MSIE-Bug:
http://www.positioniseverything.net/explorer/floatIndent.html

Das Fertiglayput http://de.selfhtml.org/layouts/nr10/vorlage/index.htm
wird in meinem MSIE 6 an sich problemlos angezeigt, hast du etwas am
Code verändert?"

(wie gesagt am code habe ich nichts verändert)habe mir die seite auch schon angeschaut und den teil gefunden den ich verändern müsste weiss aber ehrlichgesagt nicht wo ich das im dokument einfügen muss. habe es schon an einigen stellen probiert mit mäßige erfolg allerdings.

da es bei Mathias mit dem IE zu funktionieren scheint hier mal ein paar daten von meinem system. den komletten quellcode poste ich dann gleich auch noch:

AMD Athlon Mp 1800+ 1,53 Ghz
512 MB DDR Ram
Microsoft XP Prof. mit Servicepack 1+2
IE explorer 6.0 mit servicepack 2

---------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- Dies ist ein Template von selfhtml.org
 Erstellt wurde es von Jeena Paradies http://jeenaparadies.net/webdesign/leistungen
 Wenn Fragen dazu Auftauchen bitte im Forum posten. -->
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>Homepage - Über uns</title> <!-- Hier sollte der Name deiner Homepage rein und der Tittel der einzelnen Webseite auf der man sich befindet hinein. Wichtig für Suchmaschinen dass hier relevante Suchwörter stehen. -->
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <!-- wichtig damit Umlaute richtig dargestellt werden -->
   <meta http-equiv="Content-Style-Type" content="text/css" />
   <meta name="Content-Language" content="de" />
   <meta name="author" content="Jeena Paradies" /> <!-- Hier sollte der Name des Autors der Inhalte dieser Seite rein. -->
   <meta name="KeyWords" content="Kostenlose, Vorlage Webseite" /> <!-- Wichtig für viele Suchmaschinen sind Schlüsselwörter die die Seite beschreiben. Auch Wortgruppen sind erlaubt. Alles getrennt durch Kommas. -->
   <meta name="Description" content="Hier finden Sie eine Kostenlose Webseitenvorlage
     die Sie für ihre eigene Seite nutzen können." /> <!-- Hier sollte ein Beschreibungstext der ganua den Inhalt dieser einen Seite in verkürzter Form wiedergibt. -->
    <link href="css/print.css" rel="stylesheet" type="text/css" media="print" /> <!-- siehe screen.css -->
    <link href="css/screen.css" rel="stylesheet" type="text/css" media="screen, projection" /> <!-- Hier sollte der relative Pfad zum Zentralen CSS-File eingetragen werden. Je nachdem in welchem Verzeichniss sich diese Datei befindet muss der Pfad angepasst werden. -->
    <!--[if lte IE 6]><link rel="stylesheet" href="css/ielte6.css" type="text/css" media="screen" /><![endif]--> <!-- Über Conditional Comments wird für den IE <= 6 ein zusätzlich notwendiges Stylesheet eingebunden -->
 </head>
 <body>
 <div id="container"> <!-- Ist dazu da alles in einem Rahmen zu halten. -->
  <a class="skip" href="#main">Navigation überspringen</a> <!-- Für Blinde die nicht bei jedem aufruf die gleichen Infos hören wollen sondern gleich zum Inhalt der Seite weitergehen wollen. -->
  <div id="logo">
   <a href="./">homepag<span>e</span></a> <!-- Hier kommt noch einmal der Name deiner Homepage rein. Was innerhalb dieses span ist wird invertiert. -->
  </div>
  <ul id="menu">
   <li>Über mich</li> <!-- Zu der Seite auf der man sich gerade befindet sollte kein Link fürhen. -->
   <li><a href="#">Leistungen</a></li> <!-- Die Links müssen noch angepasst werden. -->
   <li><a href="#">Referenzen</a></li>
   <li><a href="#">AGB</a></li>
   <li><a href="#">Impressum</a></li>
  </ul>
  <dl id="subnav"> <!-- Diese Subnavigation kann vom Inhalt verändert werden. Sie wird nicht ausgedruckt. -->
   <dt>Wilkommen</dt>
    <dd><img src="img/kopf.jpg" alt="Passphoto, langhariger Typ" class="fright" style="width: 49px; height: 52px;" />
        Hallo, auf meiner Seite hier findet ihr Informationen zu Thema und Thema.
        Erreichen kann man mich unter
        <a href="mailto:info@example.tld">info@example.tld</a>. Es wäre schön wenn
        ihr auf meinen Seiten etwas interessantes für euch finden würdet.</dd>
   <dt>Aktuelles</dt>
    <dd><a href="#">11.03.2005</a> neues Template</dd>
    <dd><a href="#">20.02.2005</a> ich habe eine neue Waschmaschine</dd>
    <dd><a href="#">15.01.2005</a> Familienzuwachs, meine Schwiegermutter zieht ein</dd>
   <dt>Informationen</dt>
    <dd>&copy; 2005 Max Mustermann</dd>
    <dd>design by <a href="http://jeenaparadies.net/webdesign/leistungen">Jeena Paradies</a></dd>
  </dl>
  <div id="main">
   <h1>Über mich</h1> <!-- Hier sollte die Überschrift für die einzelne Seite rein. Auch sehr wichtig für Suchmaschinen. -->
    <h2>Hallo allerseits.</h2> <!-- UnterÜberschriften werden von viele Suchmaschinen auch besonders beachtet. -->
    <p><img src="img/dummy_1.jpg" alt="dummy1" class="fleft" style="width: 100px; height: 71px;" /> <!-- Das alt="" Attribut sollte nicht fehlen, auch wenn es nur leer ist. Screenreader lesen ansonsten unnötig den Namen der Datei vor. -->
       Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam id erat at tellus
       tincidunt mollis. Praesent mattis tortor eu est. Donec congue sagittis arcu.
       Etiam viverra erat ut nulla. Donec hendrerit tortor et metus. Maecenas rhoncus
       dapibus leo. Donec vel ipsum ut felis vestibulum varius. Mauris ipsum nisl,
       accumsan eget, gravida non, mattis nec, nunc. Pellentesque pellentesque erat
       a arcu. Nulla semper, metus ac volutpat congue, ipsum felis mattis felis, sed
       placerat dolor velit ac urna. Nunc convallis. Donec non ligula nec nunc
       accumsan consequat. Ut in mauris. Vestibulum vitae neque sed eros convallis
       molestie. Phasellus quis ligula non tortor mattis mollis. Vestibulum sit amet
       ipsum ut ligula iaculis tincidunt.</p>
    <p><img src="img/dummy_2.jpg" alt="dummy2" class="fleft" style="width: 100px; height: 71px;" /> <!-- Bilder können rechts oder links umflossen werden. Dazu gibt es die zwei Klassen fright und fleft. -->
       Quisque molestie lorem vel risus. Sed volutpat. Sed consectetuer pulvinar turpis.
       Mauris sagittis, orci ut dictum porta, augue augue cursus leo, ut condimentum
       diam mi eu leo. Nullam lacinia. Vestibulum in urna nec dui suscipit dignissim.
       Maecenas odio diam, consequat et, bibendum non, ullamcorper a, risus. Nulla
       condimentum ligula a wisi. In eget risus quis purus ultricies rutrum. Mauris
       commodo tortor eu felis.</p>
    <h2>Jetzt noch mal</h2>
    <p>Aliquam erat volutpat. Aliquam erat volutpat. Nunc massa pede, egestas vel,
       sodales vitae, fringilla ac, justo. Suspendisse ac sem nec nulla vulputate
       tincidunt. Praesent eu purus vitae nisl porta ullamcorper. Nullam justo orci,
       tristique vel, fermentum eget, condimentum in, pede. Integer sed dolor et massa
       molestie mollis. Sed condimentum. Duis viverra. Proin quis urna. Morbi sodales.
       Nam vehicula risus cursus justo. Donec vel magna.</p>
    <h3>Und dann noch mal hier</h3>
     <p><img src="img/dummy_3.jpg" alt="dummy3" class="fright" style="width: 100px; height: 71px;" />
        Sed sed wisi vel odio dapibus molestie. Sed aliquet auctor arcu. Morbi nibh.
        Fusce orci urna, elementum nec, dignissim eget, aliquet non, leo. In sit amet
        justo in ante nonummy ultricies. Vestibulum congue. Sed quis quam sed orci
        condimentum tincidunt. Aenean wisi sapien, molestie eu, eleifend at, mattis
        vitae, lacus. Duis fringilla gravida pede. Duis condimentum cursus tellus.
        Donec mollis mollis dolor. Nunc a augue. Nulla id leo ut nulla sollicitudin
        accumsan. Phasellus magna mauris, condimentum id, suscipit vel, sollicitudin
        quis, nulla. Maecenas vitae nulla. Nam dui nulla, feugiat ac, rutrum in,
        suscipit et, massa. Morbi malesuada lacinia tellus. Phasellus malesuada velit
        at purus.</p>
  </div>
 </div>
 </body>
</html>
----------------------------------------------------------------------------------
so sieht die css datei aus von der es extra eine für den IE gibt:

/* Da der Internet Explorer schon sehr alt ist versteht er einige Angaben des
   orginal CSS nicht. Hier versuchen wir mit zusätzlichem CSS ihm auf die Sprünge
   zu helfen. */

/* Max-Width für den IE 5+6 simmulieren */
div#container {
 width: 750px;
 width:expression(document.body.clientWidth>905?"900px":"auto");
}

/* Ein Workaround für den IE <=6, der kein margin: auto; zum Zentrieren der Seite versteht. */
body { /* durch das zentrieren des Body erreichen wir dass auch container zentriert ist. */
 text-align: center;
}
#container { /* Jetzt müssen wir alles innerhalb des Containers wieder linksbündig machen. */
 text-align: left;
}

/* Logo im IE 5+6 nicht abschneiden lassen */
#logo {
 line-height: 63px;
}

/* Menü anpassen für den IE 5.0x */
html + body #menu {
 height: 1.3em;
}
html + body #menu li {
 display: block;
 float: left;
}

/* Abstände bei der Subnavigation bei IE 5+6 anpassen */
#subnav {
 padding-left: 10px;
}
------------------------------------------------------------------------------

yo das war es erstmal hoffe ihr könnt mir weiterhelfen!