Wie verankern Sie ein Element mit einer Baseline und größen es basierend auf einem anderen "gepinnten" Element?

Question

Wie verankern Sie ein Element mit einer Baseline und größen es basierend auf einem anderen "gepinnten" Element?

9

Hier ist ein Bild von dem, was ich meine:

Wenn Sie eine feste Höhe h von der Basislinie haben, in der der Pin liegt, und das grüne Element dynamisch skaliert ist, wie können Sie das orange Element dazu bringen, den Abstand zwischen den beiden einzunehmen?

html css css3 flexbox centering

mxiong 17.08.2016, 18:27

quelle

2 Antworten

0

Sie können dafür Tabelleneigenschaften verwenden. Tabellenzellen füllen ihre übergeordnete Breite. Wenn eine Zelle kurz ist, wird die andere erweitert, um ihre Eltern zu füllen. Der Trick ist hier, um 90 ° Ihren "Tisch" zu drehen und es ist fertig. Um die 'Höhe' Ihres gepinnten Elements zu ändern, ändern Sie die Breite. Das Ankerelement wird entsprechend skaliert.

Seien Sie sich dessen jedoch bewusst: Ссылка

%Vor% %Vor%

caroso1222 17.08.2016 18:50

quelle

Tags und Links html css css3 flexbox centering

Django: Verwenden von Annotate, Count und Distinct in einem Queryset Mit rvest ist es möglich, auf einen Tab zu klicken, der ein div aktiviert und neuen Inhalt zum scraping anzeigt

score 3 · Accepted Answer

Haben Sie genau das, was Sie in diesem Fall benötigen, indem Sie flexbox verwenden.

Der Stift bleibt ungefähr auf der gleichen Höhe über der Grundlinie, geben oder nehmen 1px.

Wie es funktioniert : Wenn das grüne Element wächst, sagen wir 10px , wird der Pin um 5px erhöht. Aber das Flex-Setup bedeutet, dass die dummy und die orange Box 5px reduziert und somit den Pin auf einer konstanten Höhe hält.

%Vor% %Vor%