Layout Problem: 2 Artikel nebeneinander

**kirni99** · 05.03.2010, 08:15

Hallo!

Meine Typolightseite soll folgendes layout haben:

oben der header

unter dem header soll links und rechts jeweils ein bereich für artikel sein.

kein footer.

die linke und rechte spalte ist gleich groß und die beiden haben einen unterschiedlichen hintergrund.

das ist mein jetziger stand.

so nun zu meinem problem:

der hintergrund der artikel soll bis zum seitenende gehen, leider endet er aber mit dem artikel ende und darunter ist alles weiß. ich wollte nun wissen, ob es eine möglichkeit gibt, dass die artikel hintergründe immer bis zum seitenende gehen?

danke

mfg kirni

**planepix** · 05.03.2010, 08:23

Hallo kirni,

Willkommen im TYPOlight-Forum.

Suche einmal im Forum und im Internet (Google) nach "faux columns".
Wenn die Hintergrundfarben auf allen Seiten gleich sind, dann kannst Du das lösen, indem Du eine Grafik in der Breite des Divs #container anlegst und dann diese Grafik als Hintergrundgrafik dem Div #container zuweist.

**kirni99** · 05.03.2010, 08:37

danke für die rasche antwort, ich bin mir nicht sicher, ob mir das unbedingt weiterhilft, hier mal ein foto vom layout:

layoutproblem.jpg

Mein Problem ist der weiße Hintergrund von unten. Die hintergründe der Artikel sollen bis zum Seitenende reichen, unabhängig von den Auflösung.

**planepix** · 05.03.2010, 08:48

Hallo kirni,

genau die Grafik legst Du an in der gewünschten Breite und als Höhe dann 1 Pixel.

CSS wird dann so sein:

Code:

#container
{
background:url(tl_files/background.gif) repeat-y top left;
}

Ergänzend kannst Du einen Footer einbauen, den Du dann nicht befüllst.

**kirni99** · 05.03.2010, 09:16

danke nochmal, aber wie kann ich die grafik dynamisch machen, sodass die linke und rechte hälfte immer gleich groß ist(unabhängig von der auflösung)?

**planepix** · 05.03.2010, 09:28

Hallo kirni,

die Breite der beiden Spalten kannst Du im Seitenlayout festlegen.
Entweder Du vergibst eine feste Breite in Pixel oder wählst eine relative Größe (em oder %) aus und definierst für den #container ebenfalls eine relative Breite.
Skalieren im Sinne Browserfenster vergrößern führt nicht zur dynamischen Vergrößerung der Spalten; das wird nur bei Vergrößerung (Zoom - STRG+) erreicht.

**kirni99** · 05.03.2010, 09:34

ok, aber da wären wir ja wieder beim anfänglichen problem angekommen:

wie breit mach ich dann das hintergrund bild für den container? die linke und rechte spalte müssen ja gleich groß bleiben und in der und die rechte muss von der mitte aus starten.

**barz** · 05.03.2010, 15:26

Dann solltest Du das Hintergrundbild in den Body nehmen. So breit wie Du den "wrapper" definiert hast. Soll ja zenrtiert sein.

z.B. <body style="background-attachment:inherit; background-image: url(hi.gif); background-position:center; background-repeat:repeat-y; ">

Das geht dann immer bis zum Bildschirmrand, egal bei welcher Auflösung.