#1 8. Juni 2011 Hi alle Ich hab da so ein echt mühsames Problem: Ich hab in einem stylesheet meine divs definiert. Im oberen Bereich stimmt auch alles schön. Nun in der mittleren Div-Reihe wo auch der Content ist, hab ich 3 divs nebeneinander: bg_left, content und bg_right. bg_left und bg_right haben jeweils eine Hintergrundgrafik drin (je 2px hoch). Nun wollte ich die Höhe des Contentbereiches (also aller 3 divs) variabel je nach Höhe des Inhalts machen. Dazu wollte ich die Anweisung "height: auto" verwenden. Da ist auch schon das Problem: Sobald ich beim bg_left height: auto reinmach, verziehts mir das komplette Design, es sieht so aus als würde der div irgendwie gar nicht angezeigt... Definiere ich jedoch eine Pixelhöhe, so funktionierts ohne Probleme, das Design stimmt und die definierte Höhe greift... Hat jemand eine Idee wieso das so ist? Was mach ich falsch? Und wie krieg ich den Contentbereich variabel hoch? Danke schonmal für eure Hilfe! Hier noch mein Stylesheet (jajaja, ich bin Anfänger, zerreist mich nicht ^^ Solangs funktioniert isses für mich ok ): Spoiler HTML: @charset "utf-8"; /* CSS Document */ body { margin: 0 auto; background: #5daef9; } * { color:black; font-family:Verdana,Tahoma,Arial,sans-serif; } h1 { font-size:200%; font-style:italic; border-bottom:solid thin black; margin-left:10px; margin-right:10px; } h2 { font-size:70%; font-variant:small-caps; color:#F90; text-decoration:underline; } h3 { font-weight:bold; font-style:italic; font-size:100%; } h4 { font-weight:normal; font-size:90%; } h5 { font-style:italic; font-weight:normal; } h6 { color:white; font-size: 60%; font-weight:bold; } #container { margin: 0 auto; width: 1024px; height: 768px; text-align: left; } #header { background-image: url(Bilder/img_01.png); width: 100%; height: 212px; } #navigation { width: 100%; height: 32px; } #bg_left { float: left; width: 176px; height: 455px; background-image: url(Bilder/img_09.png); } #bg_right { float: left; width: 140px; height: 455px; background-image: url(Bilder/img_11.png); } #content { background: #FFFFFF; float: left; width: 708px; height: 455px; } #footer_left { background-image: url(Bilder/img_12.png); float: left; width: 176px; height: 69px; } #footer_center { background-image: url(Bilder/img_13.png); float: left; width: 711px; height: 69px; } #footer_right { background-image: url(Bilder/img_14.png); float: left; width: 137px; height: 69px; } *edit* sorry, gerade gesehn dass es im falschen Bereich ist... bitte mal moven ^^ *edit2* danggööööööö ^^
#2 9. Juni 2011 AW: Div-Höhe Problem hi, guck mal unter punkt 4: FAQ -- Häufig gestellte Fragen und häufig gegebene Antworten - XHTMLforum so wie ich dich verstehe, willst du das die bg-grafik deiner 2 spalten (links, rechts) immer gleich zum inhalt mitwächst. das muß gefakt werden. d.h. HTML: <div id="main"> <div id="left"></div> <div id="content"></div> <div id="right"></div> <div style="clear:both;"></div> </div> in main liegt dein bg-grafik auf voller breite. left, content und right floaten (die haben ihre eigene höhe). clear ist nötig um main auf höhe zu bringen. nun solltest du dein 100% anmuhtung haben.
#3 9. Juni 2011 AW: Div-Höhe Problem hmmm würde erstmal float:right float left benutzen ;-) wenn ichs richtig verstehe willst du das der inhaltsbereich nach unten hin mitwächst? bei mir hat das hier funktioniert padding-bottom: 32767px; margin-bottom: -32767px; shalom
#4 9. Juni 2011 AW: Div-Höhe Problem Also, ich möchte dass der Inhalt grundsätzlich so lang wie möglich sein kann, also das Design nach unten variabel hoch ist... Nun ist es so, wenn ich für den bg_left-div eine Höhe in px definiere, funktioniert das ohne Probleme... Sobald ich aber height: auto; mache, blendets den Div irgendwie aus oder so, auf jeden Fall zerreists das Design völlig... Ich hab das mit dem clear: both ausprobiert und hat auch nicht funktioniert... ebenso hats mit stropharias Vorschlag nicht geklappt... hoffe irgendwer kann mir damit noch helfe, ich raste gleich aus xD
#5 10. Juni 2011 Zuletzt von einem Moderator bearbeitet: 14. April 2017 AW: Div-Höhe Problem geht ohne probleme egal welche spalte den meisten inhalt hat und somit die höhe vorgibt, das bg-img wächst mit. wenn noch fragen offen sind, frag. // edit alle .floatl elemente haben ein border-bottom um dir zu zeigen wie hoch diese element in wahrheit sind.
#6 10. Juni 2011 AW: Div-Höhe Problem Ha! Habs doch noch geschafft mittels "min-height: 455px"... So wird das Design richtig angezeigt, ist aber in der Höhe variabel wenns mehr zum anzeigen gibt... Danke trotzdem für eure Hilfe! @onip: ich hab aus deiner html immerhin 2 floats gemacht (für content-streifen und für footer-streifen) und die auch als class definiert... Danke also .closed