Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „DIV-Container rechts bis zum Fuß der Webseite füllen“

Anina

Pixelschubserin

Hi!

Ich habe da irgendwie grad ein kleines Problem...

Und zwar habe ich eine Webseite erstellt (Dreamweaver). Auf der rechten Seite ist ein Div-Container (soll so ne Art Rightbar werden), Navi ist oben.
Jetzt möchte ich, dass der Container sich mit der grauen Farbe der Länge der Seite anpasst (also quasi der Länge des Contents), leider ist der grau hinterlegte Teil immer nur so lang wie der Inhalt der Sidebar.

Hier mal ein Link zu einer der Seiten:


Ich könnte die Rightbar jetzt natürlich bei jeder Seite manuell verlängern, aber irgendwie wäre das nicht so im Sinne der Sache, da ich eine Vorlagenseite erstellt habe wo ich diesen Part nur einmalig abändern muss und er sich automatisch auf allen Seiten ändert. Nur wie ich dem Teil sage, dass es sich automatisch nach unten verlängern soll weiß ich irgendwie nicht. Und Google will mir auch nichts verraten... ;)

Danke schonmal für eure Hilfe,
liebe Grüße
Anina
 

Anina

Pixelschubserin

Schaue ich mal, klingt ja genau nach dem wonach ich suche...
... melde mich nochmal ob es geklappt hat.
Danke schonmal!

Hm... wäre wohl zu schön gewesen... :)

Bin exakt dieser Anleitung:
http://www.ohne-css.gehts-gar.net/0005.php

gefolgt. Leider wird es bei mir in keinem der Browser angezeigt. Da ich jetzt leider erstmal weg muss, probiere ich es morgen nochmal, bzw. nochmal eine andere Anleitung oder so...

lg
 
Zuletzt bearbeitet von einem Moderator:

Misco

Nicht mehr ganz neu hier

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Mir ist folgender Trick bekannt:

Sidebar: padding-bottom: 10000px; margin-bottom: -10000px;
Container: overflow: hidden;
 

Misco

Nicht mehr ganz neu hier

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

klappt aber meist prima und man muss keine Grafiken basteln oder zusätzliche divs anlegen :)
 

cebito

undefined

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

klappt aber meist prima und man muss keine Grafiken basteln oder zusätzliche divs anlegen :)
Nur dumm, wenn der mal länger wird als der Content und Content auch nicht den Hintergrund vom übergeordneten Container besitzt... :uhm:
Dann sieht das Ganze so aus:



dasselbe in "Grün"...
 
Zuletzt bearbeitet:

Myhar

Hat es drauf

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Das war auch eine schlechte Anleitung.
Wie Misco schon kurz erklärt hat, gibt es dafür bessere Methoden. Eine detailliertere Anleitung für Miscos Technik ist hier zu finden. Damit solltest du keine Probleme haben, dein gewünschtes Layout zu erreichen.
 

Herr_D

offline

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Bei dem beispiel da oben (wobei das Grau ziemlich *hust aussieht) würd ich immer mit 'nem Hintergrundbild für den wrapper arbeiten... breite weiß px/ grau px mal 2px höhe sind 2kb und eine zeile code im css...
 

schnullerbacke

Aktives Mitglied

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Ich würd's auch machen wie Herr_D vorschlägt.

Um das div "sidebar" und das div "content" evtl. noch ein umschließendes Div bauen.
Dieses bekommt dann als Hintergrund ein Bild mit 840px Breite, 1 oder 2 px Höhe, Rechts grau - links weiß oder transparent. (Das grau so breit, wie die rechte Spalte ist).

Die Hintergrundfarbe vom Div Sidebar kannst du dann entfernen.
 

Myhar

Hat es drauf

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Warum ich die Lösung mit der Grafik nicht empfehle: Die Spalten sind danach nicht mehr skalierbar.
Da kann ich gleich ein Tabellenlayout machen, ist auch nur ein wenig Code und funktioniert genauso....
 

burn4ever

Nicht mehr ganz neu hier

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Hmmm,
wie wäre es denn via css über "height":


Mit height:100%; skalliert der div sich immer bis auf die Größe seines Eltern-Elementes.
 
Zuletzt bearbeitet:
G

golodhrim

Guest

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Hmmm,
wie wäre es denn via css über "height":


Mit height:100%; skalliert der div sich immer bis auf die Größe seines Eltern-Elementes.
Dies sollte der weg zum gehen sein. wenn sich das div ueber css height auf 100% skaliert so sollte dein grauer balken bis zum footer laufen und buendig abschliesen. Sehr gute Quellen sind hier auch immer selfhtml.
 

cebito

undefined

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Hmmm,
wie wäre es... Mit height:100%; skalliert der div sich immer bis auf die Größe seines Eltern-Elementes.

Dies sollte der weg zum gehen sein.

Vielleicht solltet ihr eure Links selbst mal lesen. height in % funktioniert nur, wenn das Elternelement eine definierte Höhe hat. Woher sollten sich die 100% auch sonst ableiten?
 

Anina

Pixelschubserin

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Hallo!

So, nochmal alle Posts durchgelesen und da der Quellcode ab und an mein Feind ist (sonst würde ich ja auch nicht Dreamweaver benutzen) mich für den recht einfachen Weg von Misco entschieden.
Auch wenn das wohl eher "quick & dirty" ist, es passt alles.

Danke euch für die vielen Posts und die zahlreiche Hilfe!

lg
Anina

PS: Herr D: Naja, die Firmenfarben des Kunden sind halt manchmal König :)
 

dragobert

Nicht mehr ganz neu hier

AW: DIV-Container rechts bis zum Fuß der Webseite füllen

Solche Probleme löst man anders:
Man hat z.B. ein Hauptcontainer der zwei weitere DIVs beinhaltet,
z.B. Sidebar und Content. Die Sidebar läßt man so wie sie ist, auch
wenn es mehrere sind. Diese haben selbst keinen Hintergrund.

Der Hintergrund einer Sidebar ist auf "none" oder auf "transparent" gesetzt.
Das einzige was wächst ist der Content-DIV. Dem muss sich dann auch der
Hauptcontainer anpassen. Der wächst zwangsläufig mit.

Die Sidebars haben ihre eigene Größe. Ist da nur eine einzige Zeile Inhalt drin,
ist die Sidebar auch nur eine einzige Zeile hoch. Da aber der Hintergrund
nicht vorhanden ist, sieht man dern Hintergrund des Hauptcontainers durch.

Der "Trick ist also dass man den Hintergund des Hauptbodys so setzt
dass er die Sidebar vorgaukelt. z.B. eine Hintergrundgrafik die genauso breit ist
wie der Hintergrund und z.B. 20px hoch ist, aber eine "Sidebarfläche" hat.

Der Hintergrund wächst mit, die Sidebars bleiben so wie sie sind,
da sie aber keinen eigenen Hintergrund haben, scheint der Hintergrund
des Hauptbodys durch und das sieht dann so aus, als wenn die Sidebars
"mitwachsen" würden.

Auf meiner Domain www.gazdik.de kannst du genau das sehen.
Man sieht 2 graue Seitenflächen die aussehen wie 2 Sidebars.
Es sind auch 2 Sidebars jedoch durchsichtig. Die zwei grauen Flächen
und die eine weisse Fläche in der Mitte ist eine einzige Grafik
nämlich der Hintergurnd vom Hauptbody.

Die Zweie möglichkeit ist ähnlich. Der Hintergrund des hauptbodys hat
die Farbe oder die Grafik die man sich als Sidebar wünscht.
Der Content ist auf z.B. Weiss, die Sidebar durchsichtig.
 
Zuletzt bearbeitet:
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
175.158
Beiträge
2.581.874
Mitglieder
67.225
Neuestes Mitglied
Petra
Oben