zweispaltig <-> einspaltig (abhängig von Bildschirmauflösung)

[andré]

zweispaltig <-> einspaltig , abhängig von Bildschirmauflösung
-------------------------------------------------------------

Hi
ich habe eine Seite in der Text zweispaltig dargestellt wird.
dies habe ich mit einer zwei-spaltigen Tabelle realisiert. In den beiden zellen befinden sich verschiedene Inhalte (in <div>-Elementen)

also in etwa so

<table>
  <tr>
   <td width="50%">
     <div>inhalt1</div>
     <div>inhalt2</div>
   </td>
   <td width="50%">
     <div>inhalt3</div>
     <div>inhalt4</div>
   </td>
  </tr>
</table>

das sieht dann so aus:

+--------------+--------------+
| inhalt1      |  inhalt3     |
| inhalt2      |  inhalt4     |
+--------------+--------------+

so und nun zum problem:

da der inhalt in den divs etwas größer ist, passt der inhalt erst ab einer 1024er auflösung vollständig auf die seite. d.h. bei ner 800er (und kleiner) Auflösung wird ein vertikaler scrollbalken eingeblendet und der Benutzer muss scrollen. Und das will ich verhindern.

Das Ziel:

Ich möchte dass bei einer Auflösung von kleiner als 1024x768 die divs in der rechten zelle unter die divs in der linken zelle eingefügt werden und die rechte spalte gelöscht wird.

also so solls aussehen:

+-----------------------------+
| inhalt1                     |
| inhalt2                     |
| inhalt3                     |
| inhalt4                     |
+-----------------------------+

optional: spalte wieder hinzufügen, falls auflösung wieder größer.
optional: gleiches verhalten abhängig von der fenstergröße bzw. sichtbarer bereich (also unabhängig von auflösung)

Frage:

Gibt es dazu schon ein Script (dass auf möglichst allen browsern läuft)?
Falls nein: wie könnte ich das am besten selbst schreiben?

Ich würd mich über jede antwort freuen!

[Detlef G.]

Hallo andré

Ich möchte dass bei einer Auflösung von kleiner als 1024x768 die divs in der rechten zelle unter die divs in der linken zelle eingefügt werden und die rechte spalte gelöscht wird.

Lass die Tabelle weg!
Gib den DIVs jeweils ein "float:left", dann schieben sie sich von ganz allein untereinander.

MFG
Detlef