Warum? und anderes Layer gehampel ...

**php_fussel** · 10-03-2009, 19:02

Hallo, gebe dem gothiclayer mal ein position:absolut ...

Gruß php_fussel

**goth** · 10-03-2009, 19:18

Das geht nicht ... im Original gibt es 2 Layer untereinander, die die Höhe des "content" Layers beeinflussen sollen.

Ich könnte sonst auch einfach left und top verwenden.

**Kropff** · 10-03-2009, 19:28

hat imho überhaupt nichts mit position zu tun. liegt wohl daran, dass content noch keinen inhalt hat. daher kommt es zu diesem ergebnis.

lösung 1:

PHP Code:


    div.gothiclayer {

      ...

      margin: 0 20px;

    }

lösung zwei

PHP Code:


    <div class="content">

      bla blubb

      <div class="gothiclayer">

      </div>

    </div>

und zur veranschaulichung

PHP Code:


    div.content {

      ...

      border: 1px solid #000;

    }

peter

EDIT:
das position kannst du imho weglassen

**goth** · 10-03-2009, 19:34

@Peter: Das ist ja prinzipiell richtig ... aber aus welchem Grunde sollte ich auf meiner Website unbedingt ein "bla blubb" stehen haben wollen?

Was, wenn der Content-Layer einfach nur 2 Layer (mit je "bla" oder "blub") enthalten soll.

Für mich ist das Verhalten von FF und Opera einfach unlogisch. Zumal der Layer durch den Linken Anteil des Margins auch nicht nach rechts verschoben wird ...

**php_fussel** · 10-03-2009, 19:39

Sobald Text eingegeben wird, dann funzt es zwar, aber das div richtet sich dann auch am Text aus (und wandert weiter nach unten, wenn der Text wächst).
Da Du die Höhe des content-divs mit den anderen beiden divs bestimmen willst, ist float:left auch keine Option (was sonst funzen würde). Komisch ...

Gruß php_fussel

EDIT:
... oder nimm das margin weg und gib dem content-div ein padding:20px ...

EDIT:
... oder lass das margin und gebe dem content-div ein padding:1px ... das funzt auch ...

**Kropff** · 10-03-2009, 19:43

hab des rätsels lösung aus meiner internen todo-liste für meinen auftritt. schau dir mal das hier an, dann hast du deine antwort. btw: im safari sieht es genau so aus.

peter

**wahsaga** · 10-03-2009, 19:56

@Kropff: Das "Problem", auf das du hier verlinkst, bezieht sich auf "zusammenfallende", engl. collapsing, margins.

goth' Problem ist aber, dass der äussere Container verschoben wird, wenn der innere ein margin-top bekommt (richtig?)

Die Erklärung findet sich in der CSS 2.1-Spezifikation zwar auch unter der Überschrift Collapsing margins, ist aber eine etwas andere:

The top margin of an in-flow block-level element is adjoining to its first in-flow block-level child's top margin if the element has no top border, no top padding, and the child has no clearance.

Das heisst im konkreten Falle, weil #content kein border-top oder padding-top hat (und #gothiclayer kein "clearance"), wird das margin-top von #gothiclayer an #content "weitergereicht", und dann #content mit Abstand von dem was vor ihm kommt dargestellt.

Original geschrieben von goth
Für mich ist das Verhalten von FF und Opera einfach unlogisch.

Das mag sein :-) - aber es ist gemäß der Spezifikation.

Zumal der Layer durch den Linken Anteil des Margins auch nicht nach rechts verschoben wird ...

Für die horizontalen Margins ist kein derartiges Verhalten definiert, im Gegensatz zu den vertikalen.

**Kropff** · 10-03-2009, 19:59

@Kropff: Das "Problem", auf das du hier verlinkst, bezieht sich auf "zusammenfallende", engl. collapsing, margins. Die Erklärung findet sich in der CSS 2.1-Spezifikation zwar auch unter der Überschrift Collapsing margins, ist aber eine etwas andere:

auf die habe ich mich bezogen. sorry, vergessen, darauf hinzuweisen. mea culpa.

peter

Warum? und anderes Layer gehampel ...