Bricks Version: 1.5.2 Browser: Opera Latest OS: Win 11
Hey guys,
Apologies if this is a user error and me not understanding the new logic correctly in 1.5.2 about the static position property, but I have experienced this on a couple of sites I am building, so want to report it.
It happens with different layouts i.e. 1 column sections and two-column sections etc.
The easiest way to recreate it is to:
Add 2 column section
Add an image to the left column
add a heading to the right column (optional)
Set the container with the image to position: relative
Set the image to Absolute
My understanding is that because I added relative to the container the image should stay confined within the container and not breakout of the section altogether?
Its strange, it does not bleed into the other container to the right but is forced down and outside the section.
I think your understanding of absolute is a little bit off:
Absolute doesn’t respect boundaries like you might expect
Similarly, absolute takes the element out of the traditional flow
Absolute is positioned relative to it’s closest relative parent. Typically Top+Left unless otherwise stated.
Because you’ve taken the image out of the traditional flow of html, the container shrinks down it’s height to fit the only content that it believes is left (the Heading).
Bonus: the only reason it respects the width is because the image has “max-width: 100%;” set. So in that sense, it does respect the containers bounds. If you were to set “max-height: 100%;”, you would see the image disappear.
The gap at the top threw me off, but this was due to the section having centre applied. I was expecting it to take up the position of T:0 L:0 regardless
I also just realised I was trying to use absolute positioning on the image to be used as a background image for the content rather than have a relative image and absolute content. #
