Probleme mit float und align

[Jan Kösters]

Hallo,

mein Problem sieht folgendermaßen aus:
Wenn ich in einem div einen Hintergrund oder/und einen Rahmen definiert habe, werden der Hintergrund und der Rahmen, wie im oberen Beispiel Code ersichtlich, nicht um den gesamten Inhalt des äußeren Divs gezogen.

Um darzustellen wie es aussehen soll habe ich einen zweiten Code (unterer) mit einer Tabelle beigefügt.

Was muss ich am oberen Code, bzw. den Stylesheets ändern damit der obere Code genauso angezeigt wird(Browserübergreifend) wie der untere

<style>
 .rahmen{border: 1px solid #0000FF;background-color:#CECECE;padding:10px;}
 .left{float:left;width:30px;height:200px;background-color:#00FF00;}
</style>

<!-- oberes Code-Beispiel -->

<div style="clear: both;">
 <div class="rahmen">
  <div class="left"></div>
  Dieser Text ist nur zur Problemdarstellung.
  Dieser Text ist nur zur Problemdarstellung.
  Dieser Text ist nur zur Problemdarstellung.
  Dieser Text ist nur zur Problemdarstellung.
  Dieser Text ist nur zur Problemdarstellung.
  Dieser Text ist nur zur Problemdarstellung.
  Dieser Text ist nur zur Problemdarstellung.
  Dieser Text ist nur zur Problemdarstellung.
  Dieser Text ist nur zur Problemdarstellung.
 </div>
</div>

<!-- unteres Code-Beispiel -->

<div style="clear: both;">
<table border="0" cellpadding="1" cellspacing="0" bgcolor="#0000FF">
<tr>
 <td>
  <table border="0" cellpadding="10" cellspacing="0" bgcolor="#CECECE">
  <tr>
   <td>
    <div class="left"></div>
    Dieser Text ist nur zur Problemdarstellung.
    Dieser Text ist nur zur Problemdarstellung.
    Dieser Text ist nur zur Problemdarstellung.
    Dieser Text ist nur zur Problemdarstellung.
    Dieser Text ist nur zur Problemdarstellung.
    Dieser Text ist nur zur Problemdarstellung.
    Dieser Text ist nur zur Problemdarstellung.
    Dieser Text ist nur zur Problemdarstellung.
    Dieser Text ist nur zur Problemdarstellung.
   </td>
  </tr>
  </table>
 </td>
</tr>
</table>
</div>

Ich hoffe es kann jemand etwas mit meiner Frage anfangen und sie beantworten.
Danke im Voraus

[Cheatah]

Hi,

Wenn ich in einem div einen Hintergrund oder/und einen Rahmen definiert habe, werden der Hintergrund und der Rahmen, wie im oberen Beispiel Code ersichtlich, nicht um den gesamten Inhalt des äußeren Divs gezogen.

das liegt an der Berechnung des Wertes "auto" für die height-Eigenschaft, in die gefloatete innere Elemente nur dann mit einbezogen werden, wenn das Element selbst gefloatet ist.

<style>

ERROR: Required attribute "type" missing.

.rahmen{border: 1px solid #0000FF;background-color:#CECECE;padding:10px;}

Du solltest Leerzeichen einsetzen, um Deinen Code lesbarer zu gestalten.

Cheatah