Streaming live at 10am (PST)

Parent element taking style from child


#1

I’m having trouble with something on webflow for a while and I decided to ask you guys to help me understanding how this works. As far as I’m aware, the styles we set should cascade down (parent->child), but for me is happening the opposite on this case. This is the scenario: I wanna create a 100 vh hero section with a div box with margin on all 4 sides within it. I set the margin on the div (child) but it pushes the margin of the hero section also, moving everything with it. As far as I understand the margin set on the child element should be relative to the parent and should not affect the parent. I don’t know if I was clear, but I don’t understand why this is happening or if i’m doing something wrong. My goal is to create a hero section similar to this:

I appreciate any help.

Thanks


Here is my site Read-Only: LINK
(how to share your site Read-Only link)


#2

You could have collapsing margins. It took me a while to understand this too. Look up collapsing margins online and you’ll get some interesting articles on (Adjacent Elements).

Try increasing the outer element’s margin to 5 or something noticeable. Then remove the inner elements margin all together. See how that flows on the page.


#3

I assume you are using 100% for the child element and that pushes the margins off screen, right? Just use padding on the parent and you’ll be all set.


#4

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.