"Overlay" section, between section, with dynamic content
I'm trying to recreate this effect (the overlay section that is in between two sections, with the form in it), without calculating the height with JS and positioning it with
absolute. Initially, I thought that I could use something like margin-block-start: -50% to move it up 50 % of its height, and therefore make the content below "follow along", but it moves up waaay more than that. You guys have any other approaches I should look into? I'm running out of ideas.
4 Replies
Just learned that a percentage value for
margin-top (or margin-block-start) is relative to the inline size of the containing block. 😔you can do that with css grid and overlapping rows.
something like this
That's really clever! Thanks for sharing!