K.-H.: Problem mit float

SELF-Forum

Problem mit float

K.-H.
– Informationen zu den Bewertungsregeln

Hi,

ich schaffe es nicht, den Text "zzzz..." direkt unter das rot-markierte div zu setzen. Je länger der Text auf der linken Seite ist, desto weiter rutscht auch der rechte Text "zzzz." nach unten. Das (eine) clear beendet zwar das darüberstehende float allerdings mit dem seltsamen Nebeneffekt.

  
<html>  
<head>  
<title></title>  
<style type="text/css">  
#Links {  
                                           float:left;  
    width:150px;  
}  
#Rechts {  
    margin-left:160px;  
}  
div#Rechts_oben_l {  
                                            float:left;  
    background-color: red;   /* Im Original eine Hintergrund-Grafik */  
    width:300px;  
    height:300px;  
}  
div#Rechts_oben_r {  
    background-color: yellow;  
    padding-laft:240px;  
}  
div#Rechts_unten {  
    margin-top:1em;  
                                             clear:left;  
}  
</style>  
</head>  
<body>  
<div id="Links">  
xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>  
xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>  
xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>  
xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>  
xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>xxxxxxxxxx<br>  
</div>  
<div id="Rechts">  
<div id="Rechts_oben_L">  
</div>  
<div id="Rechts_oben_r">  
          yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy yyyyy  
</div>  
<div id="Rechts_unten">  
zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz<br>  
zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz<br>  
zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz<br>  
</div>  
</div>  
</body>  
</html>

Schönen Abend
Karl-Heinz

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Problem mit float

    ChrisB
    – Informationen zu den Bewertungsregeln

    Hi,

    ich schaffe es nicht, den Text "zzzz..." direkt unter das rot-markierte div zu setzen.

    Es gibt gar kein rot markiertes Div - ID-Matching geschieht case sensitive.

    Je länger der Text auf der linken Seite ist, desto weiter rutscht auch der rechte Text "zzzz." nach unten. Das (eine) clear beendet zwar das darüberstehende float allerdings mit dem seltsamen Nebeneffekt.

    • Informiere dich über das Stichwort Quirks Mode, und wie man ihn vermeidet.
    • Arbeite den Artikel Grundlagen für Spaltenlayout mit CSS im SELFHTML Weblog durch. Insb. der Abschnitt über das Verschachteln von float-Umgebungen ist hier für dich von Interesse.

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln