Mathias: Block-Elemente gleich hoch?

Beitrag lesen

Hallo,

ich habe ein kleines Problem, und bisher nur eine Lösung mit JS gefunden. Möchte das aber nach Möglichkeit ohne JS erledigen.
Problem:
Zwei Blockelemente direkt nebeneinander. das linke Element hat immer den gleichen Inhalt, im rechten Element ändert sich aber die Textmenge und somit die Höhe. Der Hintergrund des linken Elements soll aber immer bis zum Ende des rechten Elements gehen.
Folgend mein Code:

<style type="text/css">
 #container {
  width:100px;
  height:auto;
 }

#col_1 {
  width:48px;
  height:auto;
  float:left;
  background-color:#66FF99;
  border:1px solid #0000FF;
 }

#col_2 {
  width:48px;
  height:auto;
  float:left;
  border:1px solid #0000FF;
 }

</style>

<body style="width:auto; height:auto;">

<div id="container">

<span id="col_1">
   <p>etwas Text</p>
  </span>

<span id="col_2">
   <p>
    Viel Text<br />
    ...<br />
    ...<br />
    ...<br />
    ...<br />
   </p>
  </span>

</div>

</body>

_EOF

Den "container" verwende ich, weil drum rum auch noch allerlei "Zeugs" ist.

Danke und schönes WE!
Mathias