Dreispaltiges Layout mit Float

G

guenter

Grünschnabel
Hallo zusammen,
vermutlich ist das Thema uralt aber ich komme einfach nicht drauf ...
Ich habe drei Bereiche:
<div id="inhalt"> ... </div>
<div id="links"> ... </div>
<div id="rechts"> ... </div>
Der Inhalts-Div soll im html-Dokument aus SEO-Gründen ganz oben stehen!
Angezeigt werden soll die linke Spalte eben ganz links, der Inhalt in der Mitte und die rechte Spalte eben ganz rechts.
Ich bekomme die richtige Anzeige unter Verwendung von float:left und float:right aber nur hin, wenn ich die Reihenfolge im html-Dokument ändere:
<div id="links"> ... </div>
<div id="inhalt"> ... </div>
<div id="rechts"> ... </div>
Das möchte ich aber aus genanntem Grund nicht.
Hat jemand einen Tipp für mich? Ein float:middle gibt's ja nicht ...
 
Der Inhalts-Div soll im html-Dokument aus SEO-Gründen ganz oben stehen!
Zum Vergrößern anklicken....

Damit es als erstes gecrawlt wird oder wie? Bin seotechnisch nich so fit, tät mich aber interessieren ;)


Dafür müsstest du die Divs aus dem Fluss rausnehmen, also absolut positionieren. In billig:
HTML: 
<div id="inhalt"> INHALT </div>
<div id="links"> LINKS </div>
<div id="rechts"> RECHTS </div>

Code: 
#inhalt{
    background: none repeat scroll 0 0 blue;
    left: 20%;
    position: absolute;
    width: 60%;
}
#links{
    background: none repeat scroll 0 0 yellow;
    left: 0;
    position: absolute;
    width: 20%;
}

#rechts{
    background: none repeat scroll 0 0 green;
    left: 80%;
    position: absolute;
    width: 20%;
}

Die Abstände nach links mit "left" müssen jeweils dem Gesamtabstand nach links entsprechen (bei #right eben die Breiten von #left und #inhalt addiert).

edit: bitte verwende immer die Codeformatierungen wenn du Quelltext postest.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück