Ausrichtung von Spalten

  • Ich habe da ein Problem mit den Ausrichten von Textspalten.
    Ich habe mit großen Interesse euer HTML-Kurs-book durchgearbeitet. Zuz Zeit lese ich das Kapitel über "3 spaltiges Layout" (Seite 138).
    Die ersten 2 Spalten (Navi+Inhalt) beginnen unterhalb der Kopfzeile, jedoch die 3.Spalte (Infokasten) beginnt erst am Ende der 2. Spalte.
    Wie kann mann die 3. Spalte ebenfalls unterhalb der Kopfzeile beginnen lassen ?

  • alle drei in einen jeweils separaten <div Container eingeben - diesen im Style als position:absolute mit entsprechendem left- und width-Wert vorgeben


    BEISPIEL

    Code
    <div style="position:absolute;top:10px;left:10px;width:200px;">erster Eintrag</div>
    <div style="position:absolute;top:10px;left:210px;width:200px;">zweiter Eintrag</div>
    <div style="position:absolute;top:10px;left:420px;width:200px;">dritter Eintrag</div>
  • Vielen Dank für Ihren Lösungsvorschlag. Aber das löst nicht mein Problem.
    Hier noch mal meine Ausgangslage.:
    Ich habe einen div Container für eine Seite. Darin sind weitere Div Container für Kopfzeile, 3Spalten und Fußzeile enthalten.
    Sie Kopf- und Fußzeile erscheinen oben bzw. unten auf der Webseite.
    die 3 Spalten habe ich mit "float: left" (1. Spalte), margin Angaben (2. Spalte) und "float: right" (3. Spalte) versucht auszurichten.
    Dabei erscheint im Browser (egal ob Mozilla oder IE) die 1. und 2. Spalte direkt unter der Kopfzeile und die 3. Spalte beginnt erst am Ende der 2. Spalte. Der Bereich vom Beginn der 3. Spalte bis Kopfzeile bleibt leer.
    Wie kann man nun die 3. Spalte ebenfalls direkt unter der Kopfzeile beginnen lassen ?
    Das ist nun mein Problem.

  • das float:right gehört da nun schon mal gar nicht hin...


    dann gebe mal so ein:


    <div align="left" style="width:200px;float:left;">erster Eintrag</div>
    <div align="left" style="width:200px;float:left;">zweiter Eintrag</div>
    <div align="left" style="width:200px;float:left;">dritter Eintrag</div>


    <div style="clear:float;"></div>


    das im letzten <div eingefügte clear:float muss in nahcfolgenden Einträgen unbedingt genannt werden, sonst weiss kein Browser, wann er mit diesem Umlauf wieder mal aufhören soll.


    Es kann da nun in einem <p - Tag, <div - Tag oder sonstwo mit drinne stehen - aber vergessen werden darf es auf keinen Fall :)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!