Column absolute bug

I create 3 columns, and I do first column absolute positioning and this column shrink, it become smaller.

Here is video: https://take.ms/o8FjU


normal positioning


absolute positioning

Have you tried “rows and gutter/no gutters” ?

1 Like

No, it goes behind the column with postion:fixed. The other two columns are still influenced by the gutters of the row as @pixelwork points out. Which is why when you apply the offset it appears. If you add some positioning (eg Top and Left). You will see the 2nd Column.

It’s not a bug. You are effectively stacking without z-index

Curious to why you would need to manipulate columns like this.

Anyway, here is some info about Absolute…

and this…

@Malachiman im trying to understand why does it work this way, but I see no logic in it. What for does it need to change its size, why it just can’t be same size.

The orange column hasn’t changed size, it’s behind the other one. When you set position absolute it takes that element “out of the flow” of the html. The blue column is effectively no longer in the row.

1 Like

@Malachiman Thanks for your patience.

Ok. I see. But why blue needs to be different size? It was setted 4 columns size, why it needs to become smaller than 4 columns size even if it’s 8px less. I mean why it can’t inherit its 4 column size?
It’s confusing.

I suggest you do some further study on CSS if you really want to understand it. The column is no longer nested in the row with an absolute position. It’s very logical.