Der folgende Beitrag wurde am 18. 03. 2005, 10:43 Uhr von Dieter Raber veröffentlicht.
Hallo alle,
Ich habe zu folgendem Onlinebeispiel eine Frage.
Die Höhe von #innen bezieht sich offensichtlich auf #aussen. Das margin-top von #innen hingegen bezieht sich offensichtlich auf das ganze Dokument und nicht auf #innen. Ich habe die padding-Variante probiert, das Ergebnis ist aber gleich. Wie kann ich #innen sagen, bleib bitteschön 25% der Höhe von #aussen vom oberen Rand von #aussen weg?
Gruß,
Dieter
Der folgende Beitrag wurde am 18. 03. 2005, 11:48 Uhr von Gernot Back veröffentlicht.
Hallo Dieter,
> Wie kann ich #innen sagen, bleib bitteschön 25% der Höhe von #aussen vom oberen Rand von #aussen weg?
Scheint ja ein wirklich kniffliges Problem zu sein. Warum das Folgende funktioniert und warum man insbesondere dem äußeren Element position:relative verpassen muss ohne es dann überhaupt zu verschieben, damit das innere sich dann absolut-positioniert am äußeren orientiert, kann ich dir auch nicht sagen:
#aussen {
position:relative;
width:700px;
height:400px;
border:1px blue solid;
}
#innen {
position:absolute;
top:25%;
width:100%;
height:50%;
background-color: #EFEFEF;
}
Gruß Gernot
Der folgende Beitrag wurde am 18. 03. 2005, 12:29 Uhr von Gernot Back veröffentlicht.
Hallo nochmal,
> ... warum man insbesondere dem äußeren Element position:relative verpassen muss ohne es dann überhaupt zu verschieben, damit das innere sich dann absolut-positioniert am äußeren orientiert, kann ich dir auch nicht sagen:
Doch kann ich jetzt auch, Punkt 4.:
http://www.w3.org/TR/CSS21/visudet.html#containing-block-details
Gruß Gernot
Der folgende Beitrag wurde am 18. 03. 2005, 12:59 Uhr von Axel Richter veröffentlicht.
Hallo,
>
> > ... warum man insbesondere dem äußeren Element position:relative verpassen muss ohne es dann überhaupt zu verschieben, damit das innere sich dann absolut-positioniert am äußeren orientiert, kann ich dir auch nicht sagen:
> Doch kann ich jetzt auch, Punkt 4.:
> http://www.w3.org/TR/CSS21/visudet.html#containing-block-details
Jepp.
MudGuards Hinweis auf die Regelung zur Berechnung relativer Top- und Bottom-Margins, sollte man sich aber auch irgendwo hinschreiben, bzw. hinverlinken, sonst stolpert man da immer wieder drüber.
Prozentangaben bei margin-top bzw. margin-bottom beziehen sich auf die _Breite_, _nicht_ etwa auf die Höhe, des umgebenden Elements, soweit das nicht das Browserfenster (root) ist. Toll, was Fachleuten[1] so alles einfällt.
viele Grüße ;-))
Axel
[1] Da staunt der Laie...
Der folgende Beitrag wurde am 18. 03. 2005, 16:32 Uhr von Gernot Back veröffentlicht.
Hallo Axel,
> MudGuards Hinweis auf die Regelung zur Berechnung relativer Top- und Bottom-Margins, sollte man sich aber auch irgendwo hinschreiben, bzw. hinverlinken, sonst stolpert man da immer wieder drüber.
> (...) Toll, was Fachleuten[1] so alles einfällt.
Ich versuche immer, mir MudGuards Hinweise hinter die Löffel zu schreiben und habe so schon viel von ihm gelernt. Mich fordert seine kryptische Art ja heraus. Ich habe allerdings die Befürchtung, dass ich ihm mit meiner Vorsagerei das Spiel verderbe und er das gar nicht goutiert.
> [1] Da staunt der Laie...
... nun stell dein Licht mal nicht unter den Scheffel!
Gruß Gernot
Der folgende Beitrag wurde am 18. 03. 2005, 11:57 Uhr von MudGuard veröffentlicht.
Hi,
> Ich habe zu folgendem Onlinebeispiel eine Frage.
> Die Höhe von #innen bezieht sich offensichtlich auf #aussen.
> Das margin-top von #innen hingegen bezieht sich offensichtlich auf das ganze Dokument und nicht auf #innen.
Prozentuale margins beziehen sich auf die _Breite_ des enthaltenden Blocks (das ist NICHT zwangsweise das Elternelement). Auch die oberen und unteren margins:
<percentage>
The percentage is calculated with respect to the width of the generated box's containing block. This is true for 'margin-top' and 'margin-bottom', except in the page context, where percentages refer to page box height.
> Ich habe die padding-Variante probiert, das Ergebnis ist aber gleich.
Hier gilt sinngemäß dasselbe:
<percentage>
The percentage is calculated with respect to the width of the generated box's containing block, even for 'padding-top' and 'padding-bottom'.
> Wie kann ich #innen sagen, bleib bitteschön 25% der Höhe von #aussen vom oberen Rand von #aussen weg?
Bei der Eigenschaft top bezieht sich ein Prozentwert auf die Höhe des enthaltenden Blocks:
Percentages: refer to height of containing block
==> mach das #aussen zum containing block, positioniere darin das #innen.
cu,
Andreas
--
Warum nennt sich Andreas hier MudGuard?
Schreinerei Waechter
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
Der folgende Beitrag wurde am 18. 03. 2005, 13:08 Uhr von Dieter Raber veröffentlicht.
Hallo Andreas,
> ==> mach das #aussen zum containing block, positioniere darin das #innen.
Wenn ich dich recht verstehe, kommt das auf dasselbe raus, was Gernot gepostet hat?
Gruß,
Dieter
Der folgende Beitrag wurde am 18. 03. 2005, 13:26 Uhr von MudGuard veröffentlicht.
Hi,
> > ==> mach das #aussen zum containing block, positioniere darin das #innen.
> Wenn ich dich recht verstehe, kommt das auf dasselbe raus, was Gernot gepostet hat?
Ja. (Sein Posting existierte noch nicht, als ich mit meiner Antwort begann)
cu,
Andreas
--
Warum nennt sich Andreas hier MudGuard?
Schreinerei Waechter
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
Der folgende Beitrag wurde am 18. 03. 2005, 13:56 Uhr von Dieter Raber veröffentlicht.
Hallo Gernot, Axel und Andreas,
Danke fuer Eure Antworten.
Gruß,
Dieter
© 1998-2013 SELFHTMLImpressumSoftware: Classic Forum 3.4