Komplexere Designs -> wie erstellen?

Status
Nicht offen für weitere Antworten.

Peter Klein

Erfahrenes Mitglied
Hallo

Kann mir jemand helfen, wie man z.B. ein Design mit meheren Div`s nebeneinander macht, also mit 3 Div`s ist es ja kein Problem mit float.

Aber wie sieht es aus wennm an z.B. so wie unten in der Grafik positionieren möchte? Habe mir das die Tage in Kopf gesetzt wie es wohl gehen mag.Aber kam leider nicth weiter:


Gruß

Peter
 

Anhänge

  • 1.gif
    1.gif
    4,8 KB · Aufrufe: 11
Das wird ganz darauf ankommen, welche Eigenschaften das Layout haben soll. Soll es ein fixes, ein dynamisches, ein … Layout sein? Ein paar mehr Informationen wären hierbei hilfreich.
 
Hallo Gumbo

Ja, hast recht, habe echt wenig geschrieben, dem Karneval sei Dank:-)

Die rot markierten, nebeneinander liegenden sollten verschiedene Höhen haben können.Den Footer immer unten belassen mit einem festen Abstand, das stellt kein Problem dar.

Es geht mir halt hauptsächlich darum, wie ich die Div`s nebeneinander setze, wenn es mehr als 3 sind.Sie müssen doch, wenn ich das richtig sehe in eine übergeordnetes Div rein, wie wenn ich mehere untereiunander auch in ein Div reinsetze, oder
 
Die 5 roten DIVs könnten mit der float-Eigenschaft in ein übergeordnetes DIV gepackt werden: das Rechte mit float:right, alle anderen mit float:left.
 
Hi

Prinzipiell machst du sowas immer gleich, egal, wieviele Divs es sind – du gruppierst eins weniger als alle und floatest dieses eine z.B. rechts (dann wäre das ausgelassene das linke). Dann machst du innerhalb dieses grossen Divs wieder das gleiche usw., bis sich alle Divs dort befinden, wo du sie haben willst.

Ich hoffe mal, das war verständlich, kann sonst gerne noch eine Grafik anhängen.
 
Nur so aus Interesse:

Aber wenn ich das so mache, wäre es dann nicht von der Ladezeit her besser eine Tabelle mit 5 Spalten zu nehmen ?
Und nur so aus interesse: wann sollte ich eine Tabelle verwenden und wann divs ?

Gruß SimonErich
 
*offtopic*

Tabellen dienen nicht als Layout-Werkzeug einer Webseite, sondern zum tabellarischen Anzeigen von Daten / Inhalten.

Ein DIV-Element (division = Abteilung, Kategorie, Sparte) ist ein allgemeines Block-Element, das weitere Block-Elemente gruppieren und so die Seite in Bereiche einteilen kann.

Mit Hilfe von CSS werden diese Bereiche (Navigation, Inhalt, usw.) dann innerhalb der Seite ausgerichtet bzw. positioniert.

Anregungen und Beispiele für sog. CSS-Layouts (= tabellenlose Layouts) findest Du auf folgenden Seiten:

  1. andreas kalt.de: Ein CSS-Layout erstellen
  2. CSS 4 You - The Finest in Stylesheets: Workshop: Layouten ohne Tabellen
  3. css.maxdesign.com.au - CSS resources and tutorials for web designers and web developers
  4. glish.com : CSS layout techniques
  5. intensivstation :: CSS Templates :: Templates
  6. selfHTML: CSS-basierte Layouts
  7. Stichpunkt CSS: Layout ohne Tabellen
  8. stu nicholls | CSS PLaY | CSS layouts
 
Status
Nicht offen für weitere Antworten.
Zurück