✔ CSS 3 Spalten min+max-breite fuer Inhalt

N

Necro_nomicon

Erfahrenes Mitglied
Hallo!

Bei dem 3-Spalten-Beispiel aus dem Tutorial
(http://www.tutorials.de/forum/css-tutorials/279637-zentriertes-layout-mit-drei-spalten.html)

Wenn man hier eine min-width und max-width (fuer den Inhalt) hinzufuegt fuer den CenterCol und im diesem CenterCol jedoch ein Bild hat, dann passiert es, dass das Bild ueber die RightCol drueber geht, obwohl eben die Breite definiert ist.

Habs jetzt wieder rausgenommen mit der min-width, aber zu finden unter:
http://www.allergico.at/allergico.html

Ich wuerde es gerne so machen, dass die min-Breite die zwei Bilder sind und die max. Breite fuer den Inhalt ca. 800 px sind.

Muss man etwas spezielles definieren, damit die Bilder aus dem CenterCol nicht die rechte Seite ueberlagern koennen, sondern als Inhalt gelten?
 
Naja die bilder können einfach über den div hinausgucken da hilft auch die max width nicht, die du auf das div angewendet hast, da es nicht vererbtwird.
Aber du kannst verhindern bzw alles abschneiden was über das div hinausguckt mit:
overflow: hidden;

MFG
Mark Paspirgilis
 
Hi Necro_nomicon,

nur als kleiner Hinweis wäre vielleicht wichtig zu sagen, dass gewisse Browser min-width und min-height einfach ignorieren. ;)

Aber wie genau soll denn das Ganze hinterher aussehen?

Gruß
 
Hi,

hatten wir ein ähnliches Thema nicht schon einmal?

Nur zur Erinnerung: Dreispaltiges Layout mit relativer Breite für mittlere Spalte

Demnach wird nicht für die mittlere Spalte, sondern für das vollständige Layout eine Mindest- /Maximalbreite deklariert.

@Geoschnute: Du zielst auf den IE6 (und älter) ab, für den es min-width-Workarounds gibt, und die height-Deklaration wird von ihm als "Mindesthöhe" interpretiert.

mfg Maik
 
Danke euch beiden fuer die Hinweise!

Schon wieder dieses overflow:hidden. Ich glaube, ich muss dringend darueber nachlesen. Irgendwie denke ich an das nie!

Das mit dem vererbt ist mein Problem...immer wieder. Da ich mehr die tables gewohnt bin, weiss ich noch nicht wie ich damit am besten umgehe.

Aber es muss doch Loesungen geben fuer liquide Seite mit 100% Breite fuer den Inhalt trotzdem irgendwie ein min und max angeben zu koennen.
Kann man bei den Bildern etwas angeben, dass es dann vererbt wird und als min-Breite genommen wird?
Angaben in der table helfen leider nichts.

Wie es aussehen soll?
Variante a)
So, dass es wenn man das Fenster verkleinert der Inhalt die Breite der 2 Bilder hat (nicht kleiner) und wenn man einen grossen Bildschirm hat, dass der Inhalt nicht total auseinandergeht und nur mehr eine Zeile drinnen steht.

Variante b)
Hm. An sich ginge es auch, wenn beim Verkleinern der Seite der Inhalt nicht kleiner wird als die Bilder und somit die Bilder nicht ueber den Rand rechts gehen und fuer die _ganze_ Seite eine max-Breite gilt und dann ist eben rechts der Rand weiss. Das wuerde nicht stoeren.

Generell ist es halt so, dass wenn man jetzt keinen weissen Hintergrund hat in der rechten Spalten wie bei diesem Beispiel, dann waere es besser eine Loesung zu haben wie Variante a) bei dem man den Inhalt eine max.Breite gibt und das ganze bleibt eben bei 100%

Nur ich weiss eben nicht, wie man das browserkompatibel machen kann.
 
Necro_nomicon hat gesagt.:
Aber es muss doch Loesungen geben fuer liquide Seite mit 100% Breite fuer den Inhalt trotzdem irgendwie ein min und max angeben zu koennen.
Kann man bei den Bildern etwas angeben, dass es dann vererbt wird und als min-Breite genommen wird?
Zum Vergrößern anklicken....
Guckst du hier: http://www.tutorials.de/forum/css/3...-breite-fuer-mittlere-spalte.html#post1767378 - das Modell hab ich dir vor etwas mehr als zwei Wochen schließlich nicht aus Spaß an der Freude erstellt.

Und von welchen Bilder sprichst du hier?

Necro_nomicon hat gesagt.:
Nur ich weiss eben nicht, wie man das browserkompatibel machen kann.
Zum Vergrößern anklicken....
Falls du den veralteten IE6 mit ins Boot nehmen möchtest: CSS min-width emulation for IE5-6 - alle übrigen Browser wissen mit der Mindestbreite etwas anzufangen.

mfg Maik
 
Bist du schon mal auf die Idee gekommen, die Mindestbreite für #wrapper (=950px) "aufzustocken"?

Mit einer Mindestbreite von 1060px überlappt das Bild in der mittleren Spalte auch nicht den rechten Spaltenblock.

mfg Maik
 
Ja, aber ich verstehe eben immer noch den Zusammenhang bzw. die Vorgangsweise nicht.

Muss ich mir das immer zusammenrechnen? Also die min-width kommt in den #wrapper, richtig?
Und diese setzt sich zusammen aus der Breite der leftCol und rightCol und der Breite der Bilder (bzw. des min-Inhalts)?

Und ich kann das nur ueber die min-width beim +wrapper machen und generell kann ich es nicht steuern, dass ich die Breitenangaben eines Bildes vererbe?
 
Siehe mein letzter Post - und das Problem ist aus der Welt geräumt.

mfg Maik
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück