Anzeigenproblem mit IE6

    Hallo zusammen,

    ich habe ein kleines Problem. Folgender Auszug wird in Firefox und IE7 richtig angezeigt (richtig->so wie ich es gerne hätte, nebeneinander). Jedoch stellt der IE6 die zwei Elemente nicht nebeneinander dar, sondern untereinander. Wie kann ich das beheben, dass es auch im IE6 nebeneinander angezeigt wird? Kann es sein, dass es daran liegt das sich ein Inline Element (img) innerhalb eines Block Elementes (p) befindet. Ich habe gelesen, dass ein Inline Element einen Zeilenumbruch macht, wenn der Inhalt größer ist als das Element selber. Mache ich das Bild kleiner, dann klappt es.

    Für einen Tipp wäre ich dankbar.

    Gruß Uwe


    <div id="content">
    <p style="border:0px solid #fff; margin-left:10px !important; margin-left:5px;
    font:bold 12pt Arial; float:left; width:100px;">02.02.2009</p>

    <p style="border:0px solid #fff; text-align:justify; margin-left:10px !important;
    margin-left:5px; margin-right:10px; margin-bottom:20px; font:normal 12pt Arial;
    float:left; width:650px;">
    blablabla<br />
    <br />
    blablabla<br />
    <br />
    <img height="697" width="800" alt="" src="http://www.blabla.jpg" /><br />
    <br />
    blablabla</p>
    <br style="clear:both;" />
    </div>


    body{
    text-align: center;
    background-color:#000;
    margin:0px;
    padding:0px;
    display:block;
    }

    p{
    margin:0px;
    padding:0px;
    }

    #content{
    width: 823px;
    height: 661px;
    float:right;
    margin:0px;
    padding:0px;
    overflow-x:auto;
    overflow-y:auto;
    border:0px solid #000;
    }

    Zitat

    <p style="border:0px solid #fff; margin-left:10px !important; margin-left:5px;
    font:bold 12pt Arial; float:left; width:100px;">02.02.2009</p>


    Wo margin-left und float:left zusammentreffen musst du dem Element für den IE 6 jeweils noch ein

    Code
    display: inline;

    zuweisen. Gilt auch für den zweiten Absatz und analog für float: right und margin-right;
    Erklärung: http://www.ohne-css.gehts-gar.net/0032.php

    Hallo,

    ich habe das mit display:inline; versucht. Ich habe es in beiden <p> Elemente eingefügt und im #content, leider ohne Erfolg. Kann es doch vielleicht an was anderem liegen?

    Gruß Uwe

    Hallo zusammen,

    ich habe schon sehr viele Stunden mit em Problem zugebracht,
    aber leider wird das irgendwie nichts. Hat vielleicht jemand eine
    Idee, was ich falsch mache. Im IE7, FireFox3 und Opera wird es
    korrekt angeigt, nur im IE6 nicht. Ich habe mal den Code angehängt.

    Vielen Dank schon mal im Voraus.
    Uwe1234

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">


    <head>

    <meta name="language" content="deutsch, de">
    <meta http-equiv="content-language" content="de">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>blablabla</title>

    <style type="text/css">
    <!--

    body{
    background-color:#000;
    }

    #wrapper{
    width:1000px;
    height:800px;
    margin:10px auto;
    background-color:#000;
    background-image: url('/images/background/h_05.jpg');
    background-repeat: no-repeat;
    border:1px solid #000000;
    }

    #title{
    width:1000px;
    height:139px;
    }

    #left{
    width:177px;
    height:661px;
    float:left;
    }

    #content{
    width: 823px;
    height: 661px;
    overflow-x:auto;
    overflow-y:auto;
    float:right;
    }

    .spalte_li{
    border:0px solid #fff;
    float:left;
    width:100px;
    display: inline;
    }

    .spalte_re{
    border:0px solid #fff;
    float:left;
    width:650px;
    display; inline;
    }

    //-->
    </style>

    </head>

    <body>

    <div id="wrapper">
    <div id="title"></div>

    <div id="left"></div>

    <div id="content">
    <div class="spalte_li">blablabla</div>
    <div class="spalte_re">
    <img height="697" width="800" alt="blabla" src="blablabla.jpg">
    </div>
    <br style="clear:both;">
    </div>
    <br style="clear:both;">
    </div>

    </body>
    </html>