Verschachtelte DIVs: Nebeneinander statt untereinander (HTML, CSS und Javascript)

[thread]2191[/thread]

Verschachtelte DIVs: Nebeneinander statt untereinander

Ronnie

2004-02-10 11:53

User since
2003-08-14
2022 Artikel
BenutzerIn
[default_avatar]

Hallo. Vieleicht habt ihr ja eine Idee zu folgendem Konstrukt:

Code: (dl )

<div>
  <div class="red"> ... </div>
  <div class="green"> ... </div>
  <div class="blue"> ... </div>
</div>

In den jeweiligen <div>s befinden sich Tabellen. Diese möchte ich via CSS nebeneinander positionieren, was auch funktioniert, weil ich die Positionierung relativ zum aussenliegenden <div> vornehmen kann.

Code: (dl )

.blue      { position: relative; left: 386px; top: -280px; width: 284px; }

Leider ändert das nichts an der insgesamt benötigten Höhe, was zu riesigen leeren Abschnitten führt?!

Crian

2004-02-10 12:21

User since
2003-08-04
5866 Artikel
ModeratorIn

Ja, das ist so bei position:relativ. Probiers doch mal mit float:left für linke und mittlere Spalte aus.

Es scheint ja so zu sein, dass Du exakte Breiten für die drei Spalten vorgesehen hast.

Ein dreispaltiges Layout von mir/KKO (*g) mit fester Breite links und rechts und variabler Mittelspalte sieht so aus:

Code: (dl )

div.l3er {
    width:520px;
    float:left;
    }
div.m3er {
    margin-left:525px;
    margin-right:350px;
    }
div.r3er {
    width:345px;
    float:right;
    }

Edit: Das nächste Element soltle dann clear:both; im Style haben.

Edit2: Im HTML-Code sollte dann erst der linke, dann der rechte und am Schluß der mittlere Div kommen.\n\n

s--Pevna-;s.([a-z]).chr((ord($1)-84)%26+97).gee; s^([A-Z])^chr((ord($1)-52)%26+65)^gee;print;

use strict; use warnings; Link zu meiner Perlseite

View all threads created 2004-02-10 11:53.