Positioning parents/childs with CSS

Hi everyone. I need some help with an issue I’ve been struggling with for some days. I’m trying to set the position of some elements via CSS code but I can’t get it to work as expected. In my page, I have the elements indexMENU_finder > Group finder_card, and I want the element MENU_finder to be positioned with respect to index, and Group finder_card with respect to its parent (MENU_finder). The code I have is as follows, and is placed inside an HTML element at the index level:

The output is:

I don’t understand why the element id_menu_finder_card is not positioned at (top: 0px, width: 0px), even though I’m setting that position in the CSS code. I’m sure I’m getting something wrong so any help would be very much appreciated.

Thank you very much.

Anything in the box when you open the dev console? Box as in “box model” (:

Thanks for your answer vini. The layout in bubble is as shown below:

and when I run in preview mode this is what I see:

As you can see, the element id_menu_finder_card is a child of id_menu_finder, but it’s not positioned well. I understand that this has something to do with the position and size of the element in the layout, but I don’t understand why it doesn’t bypass that style when I’m setting the styling in the CSS code :S

Ah, is it completely isolated from Bubble elements? Could it be ported to https://jsfiddle.net/?
If so, please do, we’ll be able to debug there (:

In jsfiddle I don’t have this problem, and everything is positioned as expected:

I think that the problem comes from the fact that in Bubble I’m specifying both a size and a position (x and y coordinates) and this interferes with the size and position I specify in the CSS code. What do you think?

Thanks again!

That’s weird, try seeing if any global css from Bubble is being applied and you’re not overriding it.
Also, some CSS properties work differently, or just don’t work at all depending on the configuration of the parent divs. I’ve ran into such problem before and took some time to figure out it was that.

What do you mean with global CSS? :thinking:

Thanks again!

CSS that is applied to generally every div in the page

Mmm I’m not really sure tbh…the only place I’m writing CSS code is inside an HTML element I place in the index page :woozy_face: