Css: Linker Bereich = Content Bereich

puur · 10.01.2009

Hi Leute,
Ich möchte mal eine frage stellen, wie macht man es am besten, das ein div was sich links neben dem Content Bereich befindet, mit dem COntentbereich mit wächst. Also wenn der content länger wird soll auch der Hintergrund der Navigation links mit wachsen.

hier ein Bsp.:

Bitte kostenlos registrieren, damit du die Links siehst.

bigpaul · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

Contennt+Navi in ein div werfen und dann der Navi ein..
margin-bottom: auto geben.
Müsste eigentlich gehen. Probiers mal aus.

Schöne Grüße,
Bigpaul

ich98 · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

puur schrieb:
Hi Leute,
Ich möchte mal eine frage stellen, wie macht man es am besten, das ein div was sich links neben dem Content Bereich befindet, mit dem COntentbereich mit wächst. Also wenn der content länger wird soll auch der Hintergrund der Navigation links mit wachsen.

hier ein Bsp.:

Ein wirkliches Mitwachsen kannst du nicht erzeugen. Du kannst es nur so aussehen lassen, als würde die Navigation mitwachsen:

Bitte kostenlos registrieren, damit du die Links siehst.

Ilse_Schnick · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

bigpaul schrieb:
Contennt+Navi in ein div werfen und dann der Navi ein..
margin-bottom: auto geben.
Müsste eigentlich gehen. Probiers mal aus.

Schöne Grüße,
Bigpaul

Geht nicht, ging noch nie.

Per Javascript die Höhe regeln lassen oder trixxen und zwar dem Haupt-div ein Hintergrundbild (zweifarbig) zuordnen

ich98 · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

Ilse_Schnick schrieb:
Per Javascript die Höhe regeln lassen...

Keine Gute Idee, was sollen die Nutzer ohne JS sehen?

Ilse_Schnick · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

ich98 schrieb:
Keine Gute Idee, was sollen die Nutzer ohne JS sehen?

Das ist doch nicht die Frage gewesen und vor allem so ne Pseudoklugscheißerantwort

Wie viele Leute (außer ein paar Wichtigtuern) haben den JS abgeschaltet?

@puur mir ist grad noch die Möglichkeit ohne Hintergrundbild eingefallen:

div wrapper (außenrum um alles): Hintergrundfarbe der linken (kurzen Seite zuordnen) dem Inhaltsdiv einen anderen eigenen BG zuordnen

Quelltext kannst dir ja mal ansehen

ich98 · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

Ilse_Schnick schrieb:
Das ist doch nicht die Frage gewesen und vor allem so ne Pseudoklugscheißerantwort Wie viele Leute (außer ein paar Wichtigtuern) haben den JS abgeschaltet?

Mehr als du denkst und im ersten Beitrag hab ich schon eine Lösung verlinkt.

Übrigens kein Grund so pampig zu werden...

Ilse_Schnick · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

ich98 schrieb:
Mehr als du denkst und im ersten Beitrag hab ich schon eine Lösung verlinkt.

Oke, du bist der Webfreak vor dem Herrn, dann mach mal :lol:

ich98 · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

Ich seh dein Problem immer noch nicht...

Ilse_Schnick · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

ich98 schrieb:
Ich seh dein Problem immer noch nicht...

Welches Problem? Ich seh auch kein Problem.

Du: postest einen Link, in dem ein Link zur Lösung ist
Ich: poste ne Lösung

Du: meckerst über Javascript :motz:

Ich: poste das lediglich als eine Lösung

Du: JS ist aber böse
Ich: halte solche Aussagen für gaga und wenn man auch Frau was richtig macht (beim JS) würde wohl eine noscript Information mit drinstehen. :uhm:

Du: kannst es anscheinend nicht ab, dass auch noch andere Lösungen kennen? (Reine Vermutung)

Ich: geh jetzt

Aufhübschen und dann Paady feiern. Außerdem ist hier schon genung OT/ Spam im Thread.

puur · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

Also das mit dem JS ist schon richtig so, man sollte auf JS verzichten wenns geht um die seite so vielen Usern wie möglich "orginal & sauber" anzeigen zu können. ich werd mal weiter rumprobieren..

@Ich98 ich hab mir grad das FAQ durchgelesen aber leider hab ich nicht ganz verstanden wie das faux columns funktionieren soll.. die einzige codezeile ist diese:
background: #ccc url(../images/bg_birch_800.gif) repeat-y 50% 0; und diese soll ausgerechnet für den Bodybereich eingesetzt werden ;( Problem ist leider das ich fürn Body schon eine HG Farbe / grafik hab. da der BG ja ein Verlauf hat und nach dem Verlaufsrepeater nicht einfach wieder weiß kommen soll hab ich für HTML Tag und BODY Tag via CSS HGs verteilt

Hast du das denn schonmal ausprobiert und kannst mir da evtl. etwas auf die Sprünge helfen ?

ich98 · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

Ilse_Schnick schrieb:
Du: meckerst über Javascript
Ich: poste das lediglich als eine Lösung

Spricht doch nichts dagegen, dass ich die Variante nicht gut heiße, oder?

puur schrieb:
@Ich98 ich hab mir grad das FAQ durchgelesen aber leider hab ich nicht ganz verstanden wie das faux columns funktionieren soll.. die einzige codezeile ist diese:

Code:

background: #ccc url(../images/bg_birch_800.gif) repeat-y 50% 0;

und diese soll ausgerechnet für den Bodybereich eingesetzt werden ;( Problem ist leider das ich fürn Body schon eine HG Farbe / grafik hab. da der BG ja ein Verlauf hat und nach dem Verlaufsrepeater nicht einfach wieder weiß kommen soll hab ich für HTML Tag und BODY Tag via CSS HGs verteilt

Hast du das denn schonmal ausprobiert und kannst mir da evtl. etwas auf die Sprünge helfen ?

Im Grunde machst du nichts besonders. Mal angenommen dein Body hat schon eine Grafik/Farbe oder deine Navigation lässt sich so nicht füllen.

Dann sieht es im Grunde so aus. Stark gekürztes Beispiel:

Code:

<div id="wrap">
<ul id="navi">
</ul>
<div id="content"</div>
<div id="clear"></div>
</div>

Jetzt bekommt #wrap eine Hintergrundfarbe/Hintergrundbild das/die identisch mit der der Content/Navigation ist und wiederholt sich in y-Richtung (repeat-y).

Code:

#wrap {
background: #ccc url(bild.gif) repeat-y 0 0;
}
#navi {
float:left;
width:30%;
}
#content {
float:right;
width:70%;
}
#clear {
clear:both; /* Damit #wrap auch größer wird, muss hier gecleart werden. */
}

Dadurch, dass #content oder #navi den #wrap aufdrückt, ist dieser immer so lang, wie der längste der beiden Container. Da die Grafik beide Hintergründe enthält, wird der "Freiraum", den das kürzere Element erzeugt durch die Grafik ausgefüllt.
Somit sieht es so aus, als ob beide Spalten gleich lang wären.

Ilse_Schnick · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

puur schrieb:
Also das mit dem JS ist schon richtig so, man sollte auf JS verzichten wenns geht um die seite so vielen Usern wie möglich "orginal & sauber" anzeigen zu können. ich werd mal weiter rumprobieren..

Ilse_Schnick schrieb:
@puur mir ist grad noch die Möglichkeit ohne Hintergrundbild eingefallen:

div wrapper (außenrum um alles): Hintergrundfarbe der linken (kurzen Seite zuordnen) dem Inhaltsdiv einen anderen eigenen BG zuordnen

Bitte kostenlos registrieren, damit du die Links siehst.

Quelltext kannst dir ja mal ansehen

Das war n Link

ohne JS

War ne Aufforderung

puur · 10.01.2009

AW: Css: Linker Bereich = Content Bereich

okay habs verstanden danke sehr ! werd das mal testen. klingt gut.