CSS Menü- und Contentbereich soll "mitwachsen"

vengeance_1984

Lt. Commander
Registriert
Juli 2007
Beiträge
1.183
Hallo,

ich möchte eine Website so gestalten, dass sowohl der Menüinhalt als auch der Contentinhalt "mitwächst", wenn mehr Inhalt hinzugefügt wird.

Habe auch schon hingekriegt, dass es so funktioniert, wie ich es haben will, nur treten jetzt anscheinend Komplikationen auf, evtl. muss ich nach einer anderen Methode suchen.
Bislang habe ich u.a. Befehle wie

"padding-bottom: 32767px;
margin-bottom: -32767px;"

sowie ein "overflow:hidden" verwendet.

Wäre sehr dankbar, wenn ihr mir sagen könntet was es sonst für Möglichkeiten gibt (also nur per CSS).


Vielen Dank im Voraus! :)
 
Poste doch bitte ein Beispiel. Boxen wachsen in der Regel automatisch mit dem Inhalt mit, wenn das bei dir nicht der Fall ist, dann hast du wohl irgendwo Größenangaben gemacht die da besser nicht wären.
 
Also so sieht mein bisheriger Code aus, und es gab damit bis vor kurzem auch keinerlei Probleme (sogar der IE spielt mit), aber vor kurzem trat ein Problem auf (es scheint am Befehl "margin-bottom: -32767px" zu liegen, der Footer wird nämlich ziemlich weit unten erst angezeigt, man muss also ziemlich lange scrollen ;) ), weswegen ich eben auf der Suche nach einer anderen Methode bin:

---hat sich erledigt---
 
Zuletzt bearbeitet:
Wozu verwendest du diese seltsamen Werte sowie overlfow: hidden eigentlich? Schreib doch mal nen Link zu der Seite.

Ich tippe einfach mal auf eine Verbindung von overflow: hidden und float
 
also wenn ich das richtig sehe, ist ja bei der Navigation und beim Content ein Bild als Hintergrund. "#container" umschließt vermutlich Navigation und Content. Da deine Navigation eine feste Breite hat, könntest du die Hintergrundgrafik der Navigation (, die dann genauso breit sein müsste, wie es die Navigation sein soll,) einfach in "#container" schreiben und die Navigation würde automatisch mitwachsen.

Wäre der Hintergrund von Content nun eine Farbe, könnte man die Farbangabe einfach noch nach dem Hointergrundbild nennen und das Problem wäre gelöst.

Der Content soll sich ja vermutlich automatisch an die Breite des Browsers anpassen? Ansonsten könntest du Navi und Content ja einfach als eine Grafik machen.

Wenn sich der Hintergrund aber an die Breite des Browsers anpassen soll und du auch für den Content eine Grafik als Hintergrund haben willst, müsstest du vermutlich 2 Container erstellen. Im ersten Container gibst du die Hintergrundgrafik für Content an und zweiten Container, der im ersten Container ist, gibst du die Hintergrundfrafik für die Navigation an.
Beispiel:
HTML:
#container1 {
background:	url(images/Contenthintergrund2.jpg);
}
#container2 {
background-image:	url(images/Menue_2.jpg);
}
HTML:
<DIV id="container1">
<DIV id="container2">
div content und div navi usw.
</DIV>
</DIV>
 
@Darii

Mit den seltsamen Werten meinst du wahrscheinlich die hohen padding- und margin-bottom Werte? Nun, ich kann sie auch kleiner machen, aber da ich nicht weiß, wie viel Inhalt in die Website kommt, habe ich einfach mal die maximalen Werte von margin und padding genommen (jedenfalls hieß es auf der Website, von der ich den Trick habe, dass die eingesetzten Werte die höchsten verwendbaren wären).

Das oveflow:hidden ist äusserst notwendig, glaub' mir :D


@klausschreiber
Danke für den Tipp, sobald ich an meinem PC sitze, probier ich's mal aus!
 
Wenn du solch seltsamen Tricks nötig hast, machst du irgendwas völlig falsch. Das sowas „Nebenwirkungen“ hat hast du ja selbst erlebt. Von irgendwelchen Problemen die du bekommst, wenn du mal irgendwas ändern willst mal ganz abgesehen…
 
Das ist gut möglich, dass ich etwas völlig falsch mache. Bin auch noch ziemlicher Anfänger.

Allerdings habe ich fast den kompletten Quellcode der CSS Datei gepostet, wenn einer eine Idee hat, wie man das selbe Ergebnis, das ich bekomme (Banner oben, links Menübereich, das automatisch mitwächst, sobald mehr Inhalt im Contentbereich hinzugefügt wird, Contentbereich soll logischerweise ebenfalls mitwachsen, Menü und Contentbereich sollen immer gleich hoch/lang sein), wäre ich ihm sehr dankbar für Tipps.


Ahja: Meiner Google-Suche zufolge ist so ein Trick in der Tat notwendig, um mein gewünschtes Ergebnis zu erzielen. Habe auch einige Zeit gebraucht, es zu finden, da ich Bilder als Hintergrund verwende, keine Farben.



Werde aber mal ausprobieren, was klausschreiber gepostet hat, vielleicht löst das mein Problem.


EDIT: Hab's ausprobiert, löst mein Problem leider nicht. Übrigens, hier habe ich den Trick her.
 
Zuletzt bearbeitet:
hmm, also den Tip für die 2 Grafiken habe ich selber noch nicht ausprobiert, der ist mir nur beim Schreiben eingefallen. Ich verstehe aber nicht, warum der nicht funktioniert. Muss jetzt erstmal ins Bett, aber vielleicht probiere ich es dann selber mal aus.

Gruß,
Klaus
 
@vengeance_1984: Es ist wesentlich hilfreicher, wenn du *alles* postet (auch HTML) am besten in Form eines Links zu der Seite (und den Link zu deinem Tip hättest du auch gleich posten müssen). Sonst muss man immer unnötig nachfragen. Mag sein, dass das die einzige Möglichkeit ist, diesen Effekt zu erzielen, allerdings deuten diese Hacks darauf hin, dass man da Mechanismen für etwas benutzt, für die sie gar nicht gedacht sind. floats wurden z.B. garantiert nicht erdacht um dreispaltige Layouts zu erstellen.
 
Zuletzt bearbeitet:
@klausschreiber
Also deine Idee an sich funktioniert funkioniert ohne Probleme, nur hilft sie mir leider nicht bei meinem Problem weiter :)


@Darii
Ich muss erst noch fragen, ob ich den Link zu der Seite posten kann, ist nämlich nicht meine eigene Seite.
Ich kann mir auch gut vorstellen, dass es Probleme mit den float-Befehlen gibt; seltsamerweise hat aber wirklich alles funktioniert, bis ein in PHP programmiertes Gästebuch implementiert wurde - und auch da tritt der Fehler nur bei Opera 9.51 auf, bei Version 9.26 dagegen seltsamerweise nicht, ebensowenig wie beim IE6+7 und Firefox.

Ahja, und es ist nur ein zweispaltiges Layout, soweit ich das erkennen kann (links Menü und rechts Content) ;)
 
Zuletzt bearbeitet:
Also der Content-bereich soll nicht nur wachsen, sobald mehr Inhalt dazukommt, sondern das Menü soll auch dieselbe Höhe haben wie der Contentbereich; der Ttrick mit den "Faux Columns" ist mir schon des Öfteren über den Weg gelaufen, aber die Methode, die ich verwendet habe, hat ja bislang auch funktioniert, und laut der Website, von der ich diesen Tipp habe, soll es auch anstandslos funktionieren.

Ich muss noch sicherstellen, dass das Gästebuch auch wirklich einwandfrei programmiert wurde; denn schließlich ist dieses in Verbindung mit Opera 9.51 scheinbar das einzige Sorgenkind hier...


PS: Den Validator will ich lieber gar nicht erst anschauen :D

Ich denke jedoch nicht, dass das Problem daran liegt...aber ich werde mal sehen, was sich da verbessern lässt


PS: Website funktioniert jetzt tadellos, lag an einem kleinen Fehler im php-Code!
 
Zuletzt bearbeitet:
Zurück
Oben