muderseb: Anordnung einzelner Div-Elemente ohne Überlappung

Beitrag lesen

Hallo zusammen,

nach Durchwühlen diverser Foren ohne Auffinden einer Problemlösung versuche ich es jetzt mal mit einem neuen Thread. Und zwar geht es um folgende

Situation: Gerade bemühe ich mich, ein PHP-Skript für meinen kleinen Blog zu schreiben. So weit so gut. Auf der Startseite sollen links die letzten drei Artikel erscheinen, in einer rechten Spalte die letzten drei Kommentare zu jedem Artikel nebst Formular, um einen weiteren einzustellen. Die Formatierung erfolgt über CSS (und ich möchte es wenn möglich nicht mittels einer Tabellenstruktur realisieren), wobei ich die Artikelspalte aus wohlerwogenen Gründen relativ, die Kommentarspalte absolut positioniere.

Wenn ich jetzt über das unten beigefügte PHP-Skript mittels einer Schleife Artikel und Kommentare aus der MySQL-Datenbank auslese, wird zwar grds. alles korrekt dargestellt; Probleme gibt es aber, wenn die rechte Spalte (Kommentarbereich) länger als der dazugehörige Artikel wird, denn dann folgt links zwar unterhalb des alten Artikels der neue; der dabei rechts dann eingeblendete Kommentarbereich aber wird von seinem Gegenstück des vorgehenden Artikels überschrieben, was mehr als unschön aussieht. Was kann ich tun?

Vielen Dank im Voraus für eure Hilfe,
Sebastian

Der PHP-Code:

<?php

// Daten aus Tabelle für Artikel werden ausgewählt
$sq1 = "SELECT
     Titel,
     Inhalt,
     Autor,
     ID,
     Datum
    FROM
     Artikel
    ORDER BY
     Datum DESC";

$result1 = mysql_query($sq1) OR die(mysql_error());

// Ab hier wird dann die Website zusammengebaut.

echo "<div id="Grundstruktur">\n";
if (mysql_num_rows($result1)) {
  for($i=0; $i<3 AND $row1 = mysql_fetch_assoc($result1); $i++) {
   echo "<div class="Artikel">\n";
   echo "<h1>\n";
   echo "<a class="Titellink" title="Klicken Sie hier, um den Artikel mit allen Kommmentaren zu lesen." href="artikel_solo.php?id=";
   echo $row1["ID"];
   echo "">\n";
   echo $row1["Titel"];
   echo "</a>\n";
   echo "</h1>\n";
   echo "<p>\n";
      $search = array ('[b]', '[/b]', '[i]', '[/i]', '&', ':-)';
      $replace = array ('<span class="bold">', '</span>', '<span class="italics">', '</span>', '&amp;', '<img src="Grafiken/smiley_smile.gif" alt=":-)" height="15" width="15" />';
   echo nl2br (str_replace ($search, $replace, $row1["Inhalt"]));
   echo "</p>\n";
   echo "<p>\n";
   echo $row1["Autor"];
   echo "</p>\n";
   // Ab hier wird der jweilige Kommentarabschnitt eingebaut...
   // Daten aus Tabelle für Kommentare werden ausgewählt.
   $sq2 =  "SELECT
        Inhalt,
        Autor,
        Datum
       FROM
        kommentare
       WHERE
        NEWS_ID = '".$row1['ID']."'
       ORDER BY
        Datum DESC";
   $result2 = mysql_query($sq2) OR die(mysql_error());
   // Daten aus dieser Tabelle werden ausgelesen.
   echo "<div class="comments">\n";
   echo "<h1>\n";
   echo "Letzte Kommentare\n";
   echo "</h1>\n";
   if (mysql_num_rows($result2)) {
  for($j=0; $j<3 AND $row2 = mysql_fetch_assoc($result2); $j++) {
   echo "<p>\n";
   echo nl2br($row2["Inhalt"]);
   echo "\n";
   echo "<br />\n";
   echo $row2["Autor"];
   echo ", am ";
   echo $row2["Datum"];
   echo "\n";
   echo "</p>\n";
  }
  mysql_data_seek ($result2, 0);
} else {
   echo "<p>Leider momentan kein Kommentar vorhanden.</p>\n";
  }
  // ...und hier das entsprechende Formular.
  echo    "<form action="formular.php" method="post">\n";
  echo      "<textarea class="Kommentarfeld" name="Inhalt" title="Hier können Sie Ihren eigenen Kommentar eingeben." cols="31" rows="3" ></textarea>\n";
  echo   "<input class="Name" name="Autor" title="Tragen Sie hier bitte Ihren Namen ein." type="text" size="18" maxlength="25" />\n";
  echo      "<input class="Absende-Button" type="submit" value="Absenden" title="Klicken Sie hier, um Ihren Kommentar abzusenden." />\n";
  echo      "<input class="News-ID" type="hidden" name="NEWS_ID" value="";
  echo   $row1['ID'];
  echo   "" />\n";
  echo    "</form>\n";
  echo "</div>\n";
  echo "</div>\n";
  // Ende des Kommentarabschnitts.
  }
} else {
   echo "<p>Leider momentan kein Artikel vorhanden.<p>\n";
  }
   echo "</div>\n";
?>