Design Alpha Höhe der Teaser Container

[masc]

Hallo zusammen,

jetzt habe ich das Design Alpha fast soweit zurecht gebogen, daß es mir persönlich zusagt, allerdings habe ich noch einen kleinen Dorn im Auge:

Wenn ein Aufmacher mehrspaltig dargestellt wird, so weichen die Größen(Höhen) der nebeneinander dargestellten Boxen voneinander ab. Das hätte ich gerne auf gleicher Höhe.

Beispiele braucht's fast nicht, aber falls Bedarf besteht: www.masc-onLine.de gleich auf der Startseite hat's die unterschiedlich hohen Boxen...

Wäre prima, wenn jemand eine Lösung / Tipp dafür parat hätte.

Danke & Gruß,
Marian

[voodoo36]

Hallo, diese Boxengrößen richten sich doch nach deinen Inhalt...

[Paulemann]

Du könntest in diesem Bereich ein min-height vergeben.

/* Absatztyp Teaser */

div.teaserelement {
float: left;
padding: 6px 10px 6px 10px;
margin: 0px 10px 10px 0px;
background-color: #F1F1F1;
border: 1px solid #737373;
min-height: 260px;
}

Der Wert sollte sich nach den längsten Inhalt richten.

[voodoo36]

Hallo Bernd, daran habe ich auch schon gedacht, aber bleibt dann nicht immer auf einer Seite eine Leerbereich stehen!!

[Paulemann]

Klar, sieht aber sauberer aus. Noch sauberer sieht es dann aus, wenn man den Border wegnimmt.
Da es immer eine Einzelentscheidung ist, sollte man selbst den Kompromiss finden. Starr, als Designvorlage geht das halt nicht.

[voodoo36]

Ja, hast Recht, habe es mir eben mit 250px angesehen und ohne Border, nur blöd wenn auf der HP noch mehr im einem Absatz steht hat und der Wert größer wäre... dann siehts nicht so gut aus, aber das kann er dann selber entscheiden...

[masc]

Hallo,

hmm... mit

min-height: 260px;

komme ich - glaub ich - nicht so ganz weiter, da dann ja alle Teaser diese Mindestgröße hätten, auch wenn nur bedeutend weniger PLatz benötigt würde. Sprich mit der Variante müßte ich die Seite nach dem derzeit größten Teaser durchforsten, nachmessen und diese Größe dann überall verwenden...

Mein Wunsch wäre ja, die bisherige Dynamik zu erhalten, aber auf einer Seite - sprich wenn 2 Blöcke nebeneinander stehen - sollten diese die gleiche Größe haben. Das dann entsprechend ein Block mehr "Luft" enthält, wäre das gewünschte Verhalten.

Genau genommen hätte ich also gerne das Verhalten von Tabellen - nur eben mit CSS-Mitteln...

Gruß, Marian

[Paulemann]

Dann nimm den Border raus und schaue Dir das an.

[masc]

Hallo,

ich habe jetzt mal in einem lokalen Test die MinHeight gesetzt und auch optional mal den Rand ausgeblendet. Letztendlich führt dies zwar dazu, daß die Startseite so aussieht, wie ich mir das vorgestellt habe, dafür sehen andere Seiten, die auch Teaser verwenden, deutlich schlechter aus - z. B. würde speziell die Seite Fahr[rad] unter riesigen Abständen zum nachfolgenden Absatz leiden.

Ich werde mal weiter schauen, vielleicht findet sich ja noch etwas passendes. Falls sich nichts in der Richtung findet, werde ich wahrscheinlich den Hintergrund des Teasers auf die Seitenfarbe setzen und den Rand entfernen. Dann fällt die unterschiedliche Höhe der beiden Blöcke nicht mehr auf.

Mal schauen...

Danke & Gruß,
Marian

[blue]

macht doch einfach einen Overflow: hidden;
dann wird der Rest abgeschnitten...