Say you’ve acquired a two-column CSS grid and also you need a type of columns to behave like place: sticky;. There may be nothing stopping you from doing that. However the default top for these two columns goes to be “as tall because the tallest content material in both column” as a result of the default conduct for grid columns is align-items: stretch;. So, even you probably have actually “brief” content material within the column you wish to behave as sticky, it gained’t seem to maneuver as a result of actually it’s already as tall as the opposite column.
Ahmad Shadeed makes the purpose that in order for you that to work, you’ll most likely have to align-items: begin; the one you wish to behave as sticky.
I might add that in order for you place: sticky; conduct for parts inside both of the columns, you then’ll truly wish to go away the default stretch conduct alone. Right here’s an instance of what I imply there as a fork:
Subscribe to MarketingSolution.
Receive web development discounts & web design tutorials.
Now! Lets GROW Together!