nicht angemeldet michat
Gunnar Bittersmann
michat
michat
MudGuard
Gunnar Bittersmann
MudGuard
MudGuard
Gunnar Bittersmann
MudGuard
Es läuft immer wieder auf das Problem hinaus, dass ich nicht verstehe, wie jeweils die Höhe(n) kalkuliert werden und wie sie sich addieren.
Warum ist Box links nicht gleich hoch wie Box rechts.
#links {width: 20%; height: 80%; margin: 5% 0 5% 5%; float: left;
border: 2px solid grey;
}
#rechts {width: 20%; height: 40%; margin: 5% 5% 5% 0; padding: 40% 0 0 0; float: right;
border: 2px solid grey;
}
Vllt. hat jemand auch Lust darauf zu antworten:
http://forum.de.selfhtml.org/my/?t=201763&m=1361613
bye
MH
@@michat:
nuqneH
Es läuft immer wieder auf das Problem hinaus, dass ich nicht verstehe, wie jeweils die Höhe(n) kalkuliert werden und wie sie sich addieren.
Das ist in der CSS-Spezifikation beschrieben: [CSS21 §8.3, §8.4, §10.5] (nicht mehr ganz aktuell, dafür auf Deutsch: [CSS2 §8.3, §8.4, §10.5])
40% von A sind nur dann gleich 40% von B, wenn A = B.
BTW, ID-Bezeichner "links" und "rechts" sind sinnlos. Benenne nach der Funktion, nicht nach der gegenwärtig(!) gewünschten Darstellung!
Warum ist Box links nicht gleich hoch wie Box rechts.
Warum sollte?
#links {width: 20%; height: 80%; margin: 5% 0 5% 5%; float: left; border: 2px solid grey; } #rechts {width: 20%; height: 40%; margin: 5% 5% 5% 0; padding: 40% 0 0 0; float: right; border: 2px solid grey; }
Du meinst, die 'padding-top: 40%' sollten ebenso hoch sein wie 'height: 40%'? Du hast es immer noch nicht verstanden, dass sich Prozentangaben auf die _Breite_ des umschließenden Blocks der erzeugenden Box beziehen?
Vllt. hat jemand auch Lust darauf zu antworten:
http://forum.de.selfhtml.org/my/?t=201763&m=1361613
Gerne: http://forum.de.selfhtml.org/hilfe/bedienung.htm#verweise-einbinden
Qapla'
40% von A sind nur dann gleich 40% von B, wenn A = B.
Jetzt müßte ich nur noch wissen worauf du A und B beziehst.
BTW, ID-Bezeichner "links" und "rechts" sind sinnlos. Benenne nach der Funktion, nicht nach der gegenwärtig(!) gewünschten Darstellung!
Hast ja recht, war nur für das Beispiel so gewählt, in Realität heißen sie "unklar" und "mail" ;-)
Warum ist Box links nicht gleich hoch wie Box rechts.
Ich hab's auch nach durchlesen der deutschen Übersetztng noch nicht verstanden.
"<percentage>
Der Prozentsatz wird relativ zur Breite des umschließenden Blocks der erzeugenden Box berechnet. Das gilt für 'margin-top' und 'margin-bottom', außer im Seitenkontext, wo sich Prozentwerte auf die Höhe des Seitenrahmens beziehen."
Darum geht es: #links und #rechts liegen im body, also zwischen <body> und </body>. Dann ist body das umschliessende element (?), und #links und #rechts sind jeweis die erzeugenden elemente (?). Wohl nicht, denn dann müßte meine Rechnung ja aufgehen. Was dann? Nach der Einschränkung betreffs "seitenkontext" frage ich erstmal lieber nicht.
Du meinst, die 'padding-top: 40%' sollten ebenso hoch sein wie 'height: 40%'?
Jo, das war meine Hoffnung (weil von Verständnis da keine Rede sein kann), sie wurde bitter enttäuscht.
Du hast es immer noch nicht verstanden, dass sich Prozentangaben auf die _Breite_ des umschließenden Blocks der erzeugenden Box beziehen?
S.O.
Vllt. hat jemand auch Lust darauf zu antworten:
http://forum.de.selfhtml.org/my/?t=201763&m=1361613Gerne: http://forum.de.selfhtml.org/hilfe/bedienung.htm#verweise-einbinden
Danke. Zweiter Versuch: https://forum.selfhtml.org/?t=201763&m=1361613
bye
MH
Leider ist dort von "erzeugender box" die Rede was viel zur Verwirrung beiträgt (Was soll denn diese box erzeugen?).
Anders (!) hier, wo von "erzeugter box" die Rede ist, da kommt wenigstens etwas Licht ins Dunkel. Man beginnt zu erahnen, dass dies etwas mit der Box, die durch die Prozentangabe erst erzeugt werden soll zu tun haben könnte. Dann sollte man dies "zu erzeugende Box" nennen, und zwar überall.
Und der "umschliessende Block" ist doch wohl das nächsthöhere Blockelement, dessen Anfang- und Endtag die "zu erzeugende Box / den zu erzeugenden Block" im Quelltext vollständig umschließt.
Nur, nach dieser Definititon sollte #links 80% der Breite des bodys hoch sein, was rein nach Augenmaß nicht der Fall ist. Und #rechts sollte zumindest gleich hoch wie #links sein, denn eine Höhe von 40% der Breite des body + 40% der Breite des bodys für das obere padding macht in der Summe eben auch 80% der Breite des bodys.
Welche Größe und/oder welchen Größenbezug sind hier falsch verstanden?
bye
MH
Hi,
Anders (!) hier, wo von "erzeugter box" die Rede ist, da kommt wenigstens etwas Licht ins Dunkel. Man beginnt zu erahnen, dass dies etwas mit der Box, die durch die Prozentangabe erst erzeugt werden soll zu tun haben könnte. Dann sollte man dies "zu erzeugende Box" nennen, und zwar überall.
Und der "umschliessende Block" ist doch wohl das nächsthöhere Blockelement, dessen Anfang- und Endtag die "zu erzeugende Box / den zu erzeugenden Block" im Quelltext vollständig umschließt.
Wenn du es genau wissen willst, verlasse dich nicht auf Sekundärquellen, sondern lese im Original nach:
CSS 2.1, 10.1 Definition of "containing block"
Nur, nach dieser Definititon sollte #links 80% der Breite des bodys hoch sein, was rein nach Augenmaß nicht der Fall ist.
Vielleicht sollten wir (/du) erst mal klären, wie hoch body überhaupt ist.
MfG ChrisB
Vielleicht sollten wir (/du) erst mal klären, wie hoch body überhaupt ist.
body und html sind beide height 100% und width 100%
bye
MH
Hi,
Nur, nach dieser Definititon sollte #links 80% der Breite des bodys hoch sein, was rein nach Augenmaß nicht der Fall ist.
Nein, du hast height:80% angeben, und Prozentangaben bei der Höhe beziehen sich auf die Höhe des Elternelements, nicht auf die Breite.
offsetHeight von body und #links liefert mir in meinem Test im Firefox 612 vs 494 Pixel - oder anders ausgedrückt, #links hat effektiv 80,72% der Höhe von body.
Und #rechts sollte zumindest gleich hoch wie #links sein, denn eine Höhe von 40% der Breite des body + 40% der Breite des bodys für das obere padding macht in der Summe eben auch 80% der Breite des bodys.
offsetWidth von body 1263 Pixel, davon 40% sind 505 Pixel.
Plus 40% der Höhe von 612 Pixel, also 245 Pixel, macht 750 Pixel.
Die zwei Pixel Rahmen oben und unten noch dazu gerechnet, macht 745 Pixel - und das entspricht genau der offsetHeight, die mir für #rechts angezeigt wird.
Works as designed.
MfG ChrisB
Hi,
Nur, nach dieser Definititon sollte #links 80% der Breite des bodys hoch sein, was rein nach Augenmaß nicht der Fall ist.
Nein, du hast height:80% angeben, und Prozentangaben bei der Höhe beziehen sich auf die Höhe des Elternelements, nicht auf die Breite.
Ok, nicht dass ich dir nicht glaube, aber wie verträgt sich dies mit der CSS doku, eigentlich doch gar nicht!?
offsetHeight von body und #links liefert mir in meinem Test im Firefox 612 vs 494 Pixel - oder anders ausgedrückt, #links hat effektiv 80,72% der Höhe von body.
Und #rechts sollte zumindest gleich hoch wie #links sein, denn eine Höhe von 40% der Breite des body + 40% der Breite des bodys für das obere padding macht in der Summe eben auch 80% der Breite des bodys.
offsetWidth von body 1263 Pixel, davon 40% sind 505 Pixel.
ok.
Plus 40% der Höhe von 612 Pixel, also 245 Pixel, macht 750 Pixel.
'Halt, Alarm, du wechselst die Bezüge wie mancher die <setz ein was dir passt>, ich kann das nicht nachvollziehen, geschweige denn in ein einklang mit CSS bringen.
Works as designed.
Mag sein, aber bitte erkläre es mir/uns allen.
bye
MH
Hi,
Nein, du hast height:80% angeben, und Prozentangaben bei der Höhe beziehen sich auf die Höhe des Elternelements, nicht auf die Breite.
Ok, nicht dass ich dir nicht glaube, aber wie verträgt sich dies mit der CSS doku, eigentlich doch gar nicht!?
http://www.w3.org/TR/CSS21/visudet.html#the-height-property:
“<percentage>
Specifies a percentage height. The percentage is calculated with respect to the height of the generated box's containing block.”
Noch deutlicher geht's doch kaum, oder?
Plus 40% der Höhe von 612 Pixel, also 245 Pixel, macht 750 Pixel.
'Halt, Alarm, du wechselst die Bezüge wie mancher die <setz ein was dir passt>, ich kann das nicht nachvollziehen,
Was wechsle ich da irgendwas?
Das sind die Werte, die ich mit deinem Testcode, entsprechend erweitert, auf meinem Testsystem bekomme.
Das kannst du gerne auf deinem System, mit ggf. anderen Browserfenstermaßen, selber nachvollziehen.
geschweige denn in ein einklang mit CSS bringen.
Dass und wie es vollkommen im Einklang mit der Spezifikation ist, habe ich dir gerade erklärt.
Works as designed.
Mag sein, aber bitte erkläre es mir/uns allen.
CSS schreibt vor, dass es so umzusetzen ist, Firefox setzt es so um, andere aktuelle und standardkonforme Browser machen es genauso.
Works as designed. Da gibt es nicht viel mehr zu erklären.
MfG ChrisB
Meine güte, kannst du bitte klar machen, wo der Denkfehler liegt? Dein neunmalkluges Gelaber mag hilfreich zur Erlangung des 3. Doktorgrades sein, hilft aber jemandem, der den Wald vor lauter Bäumen nicht sieht kein bisschen.
Hi,
Meine güte, kannst du bitte klar machen, wo der Denkfehler liegt?
Kannst du uns bitte erklären, *wo* dein Verständnisproblem liegt?
Welchen der Zusammenhänge verstehst du nicht?
Dein neunmalkluges Gelaber mag hilfreich zur Erlangung des 3. Doktorgrades sein, hilft aber jemandem, der den Wald vor lauter Bäumen nicht sieht kein bisschen.
Du kannst keinen Wald erkennen, wenn du nicht mal weißt, was ein Baum ist.
Beschäftige dich mit den Grundlagen von CSS, lies mal in der Spezifikation nach, wie verschiedene Dinge zusammenhängen.
MfG ChrisB
height(link) = % von was?
padding(link) = % von was?
So wie ich euch verstehe ist es jeweils ________nicht________ ein Prozentanteil der gleichen Ausgangsgröße.
Ich habe nicht den geringsten Schimmer einer blassen Ahnung einer aufkeimenden Idee einer Vorstellung eines Zusammenhangs warum sich diese %-Angaben auf was auch immer _______Unterschiedliches________ beziehen.
Ich bitte hiermit endgültig um ein einfaches:
die Prozentangaben für die Höhe beziehen sich auf <die große Unbekannte>, und zwar weil...(nur wenn es euer doktoranten Durchlauchheit genehm zu erscheinen beliebt)
die Prozentangaben für der/die/das padding (Schreib ich padding forenkorrekt groß oder klein, Fragen, Fragen, Fragen) beziehen sich auf <die ganz andere große Unbekannte> (...idem s.o.)
mfsteng
Hi,
Du hast es immer noch nicht verstanden,
Du auch nicht?
dass sich Prozentangaben auf die _Breite_ des umschließenden Blocks der erzeugenden Box beziehen?
Das ist nicht richtig. Auch wenn es Fälle gibt, in denen sich Prozentangaben auf die Breite des containing blocks beziehen, gibt es auch viele Fälle, wo das nicht der Fall ist.
(mal abgesehen davon, daß es statt "erzeugend" eigentlich "enthaltend" heißen muß)
Es hängt von der jeweiligen Eigenschaft ab, worauf sich prozentuale Werte einer Eigenschaft beziehen.
Bei top, height, bottom beziehen sich Prozentangaben auf die height des containing block.
Bei left, right, width, padding, margin beziehen sich Prozentangaben auf die width des containing block.
Bei font-size beziehen sich Prozentangaben auf die font-size des Elternelements.
Bei vertical-align beziehen sich Prozentangaben auf die line-height des Elements.
Bei background-position beziehen sich die Prozentangaben auf width oder height des Elements (je nachdem, ob es um den horizontalen oder vertikalen Anteil der Position geht) und auf width oder height des Hintergrundbilds.
(diese Auflistung erhebt keinen Anspruch auf Vollständigkeit)
cu,
Andreas
@@MudGuard:
nuqneH
Bei left, right, width, padding, margin beziehen sich Prozentangaben auf die width des containing block.
Um letztere beiden Eigenschaften ging es hier.
Qapla'
Hi,
Bei left, right, width, padding, margin beziehen sich Prozentangaben auf die width des containing block.
Um letztere beiden Eigenschaften ging es hier.
Nicht nur, sondern auch um height, da height 40% + padding-top 40% eben nicht identisch zu height 80% ist.
cu,
Andreas
Nicht nur, sondern auch um height, da height 40% + padding-top 40% eben nicht identisch zu height 80% ist.
... und wenn du mir nun erklärst warum nicht bekommst du .... ähm .... foddo von 'ner Farbwaschmaschine? Deal?
Hi,
Nicht nur, sondern auch um height, da height 40% + padding-top 40% eben nicht identisch zu height 80% ist.
... und wenn du mir nun erklärst warum nicht
*W*E*I*L* padding in Prozent sich auf die *Breite* des Containing Blocks bezieht, height aber *nicht*.
80% von x sind nicht das gleiche wie 40% von x plus 40% von y, wenn y etwas anderes ist als x.
Was ist daran so schwer zu kapieren?
MfG ChrisB
*W*E*I*L* padding in Prozent sich auf die *Breite* des Containing Blocks bezieht, height aber *nicht*.
80% von x sind nicht das gleiche wie 40% von x plus 40% von y, wenn y etwas anderes ist als x.Was ist daran so schwer zu kapieren?
ü*b*e*r*h*a*u*p*t* nichts, wenn es so erklärt oder zumindest beschrieben wird.
Mein (unvollständiger) Wissensstand war bislang: Prozentangaben beziehen sich auf die Breite des übergeordneten Blocks, und der wurde durch die Hinweise auf CSS docs untermauert.
Damit ist erklärt *dass* es so ist, vielen Dank dafür. Vollkommen im Nebel befindet sich jedoch nach wie vor jegliche Vorstellung davon warum dies *so* sinnvoll sein könnte.
Derzeit befinde ich mich noch in dem Stadium, dass ich dies als Willkür empfinde um arme Anfänger zu quälen; so etwas wie "Sinn" ist mir in diesem Zusammenhang inetwa so vertraut wie dem Teufel das Weihwasser. Da liegt noch echte Arbeit vor mir ... und vor euch ;-)
Ich werde diese unterschiedlichen Prozentbezüge zwar nun zur Kenntnis nehmen, vom Verstehen bin ich nach wie vor Meilenweit entfernt, vermutlich werde ich morgen früh mit Kopfweh aufwachen, weil ich die ganze Nacht den Kopf schütteln muss.
@@michaa alias michat:
nuqneH
Damit ist erklärt *dass* es so ist, vielen Dank dafür. Vollkommen im Nebel befindet sich jedoch nach wie vor jegliche Vorstellung davon warum dies *so* sinnvoll sein könnte.
Vielleicht weil die Breite einer Box (bei unserer Schreibrichtung) eine verlässliche Größe ist, die Höhe jedoch nicht.
Sofern nicht anders angegeben, ist die Breite einer Box lediglich abhängig von der zur Verfügung stehenenden Breite des Viewports; für ein System also konstant (sieht man von der Änderung der Viewportgröße durch den Nutzer ab). Die Höhe einer Box hingegen ist auch abhängig von ihrem Inhalt (Textlänge).
Bezieht man die Prozentangaben für vertikale Innen- und Außenabstände auf die Breite, dann sind die Abstände auf allen Seiten einer Website (die dasselbe Stylesheet verwenden) gleich. Würde man die Prozentwerte hingegen auf die Höhe beziehen, wären sie auf verschiedenen Seiten unterschiedlich; das kann kaum das gewöhnlich gewünschte Verhalten sein.
vermutlich werde ich morgen früh mit Kopfweh aufwachen, weil ich die ganze Nacht den Kopf schütteln muss.
Qapla'
Hi,
Nicht nur, sondern auch um height, da height 40% + padding-top 40% eben nicht identisch zu height 80% ist.
... und wenn du mir nun erklärst warum nicht bekommst du .... ähm .... foddo von 'ner Farbwaschmaschine? Deal?
Ich verzichte auf das Photo, wenn Du endlich lernst, zu lesen.
Siehe mein erstes Posting in diesem Thread
cu,
Andreas
@@MudGuard:
nuqneH
Nicht nur, sondern auch um height, da height 40% + padding-top 40% eben nicht identisch zu height 80% ist.
Ähm ja, genau das (s|fr)agte ich doch auch: „Du meinst, die 'padding-top: 40%' sollten ebenso hoch sein wie 'height: 40%'?“
Qapla'
Hi,
Nicht nur, sondern auch um height, da height 40% + padding-top 40% eben nicht identisch zu height 80% ist.
Ähm ja, genau das (s|fr)agte ich doch auch: „Du meinst, die 'padding-top: 40%' sollten ebenso hoch sein wie 'height: 40%'?“
Und behauptest im nächsten Moment, daß sich Prozentangaben (ohne Einschränkung auf bestimmte Eigenschaften) auf die Breite beziehen - was sie aber bei height eben gerade nicht tun.
cu,
Andreas
@@MudGuard:
nuqneH
Und behauptest im nächsten Moment, daß sich Prozentangaben (ohne Einschränkung auf bestimmte Eigenschaften) auf die Breite beziehen - was sie aber bei height eben gerade nicht tun.
Nee nee, keine solche Behauptung, eher eine sprachliche Ungenauigkeit. Wir meinten von Anfang an dasselbe.
Qapla'
Nee nee, keine solche Behauptung, eher eine sprachliche Ungenauigkeit. Wir meinten von Anfang an dasselbe.
LOL, ... nur dass deine sprachliche Ungenauigkeit mich geradewegs ins Abseits führte, aber schön, dass ich mit meiner Anfrage dazu beigetragen habe für Einigkeit unter euch zu sorgen. Manchmal führt der direkte Weg wohl doch von hinten durch die Brust ins Auge .... ;-)
Hi,
Und behauptest im nächsten Moment, daß sich Prozentangaben (ohne Einschränkung auf bestimmte Eigenschaften) auf die Breite beziehen - was sie aber bei height eben gerade nicht tun.
Nee nee, keine solche Behauptung, eher eine sprachliche Ungenauigkeit.
So wie bei einem Professor:
der sagt A, schreibt an die Tafel B, meint eigentlich C, und richtig wäre D ...
cu,
Andreas
@@MudGuard:
nuqneH
So wie bei einem Professor:
Danke der Ehre. ;-)
Qapla'