rachelandrew / cssgrid-ama

Ask me anything about CSS Grid Layout
328 stars 12 forks source link

Can elements added to a column adhere to document flow spacing, rather than the grid? #100

Open glynnsmith opened 7 years ago

glynnsmith commented 7 years ago

Hello,

I've been noodling around with grid, trying to get a specific layout to work. But alas:

Codepen Link

I'm trying for a 2 column grid: The left column holds the page content, and the right column holds any number sidebar elements with variable heights.

Rather than specifying rows for the contents of the right-hand column, I'd like the elements to be placed in the second column, but adhere to regular document flow (line-heights, margins, etc). Is this possible?

Note: I'd like to keep the sidebar elements as direct children of the grid (not in a wrapper) so that I'm free to reposition them within the grid at narrower media query widths.

Many thanks. For all your grid work.

thinsoldier commented 7 years ago

https://codepen.io/thinsoldier/pen/PJJGxK?editors=0100

Lots of minmax and repeat.

thinsoldier commented 7 years ago

:( Ignore the previous comment. I failed.

thinsoldier commented 7 years ago

keep the sidebar elements as direct children of the grid (not in a wrapper) so that I'm free to reposition

Well, we can hope for better support of display:contents which would let you put the sidebar elements in a wrapper to help layout at one break point and then make the wrapper disappear while its children remain present so that you are "free to reposition".