search

rachelandrew / cssgrid-ama

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

Printing; Page breaks and CSS grid #93

Closed davidhewitt closed 7 years ago

davidhewitt commented 7 years ago

Hi,

I saw your talk at Render Conf and it inspired me to work with CSS grids since, which has been great! Thanks very much :)

I have come across one snag which I haven't found an answer for in documentation: is there any way to control page breaks inside grid containers?

It feels like the row gaps should be a nice opportunity for browsers to insert page breaks, but from a quick hack (see this jsfiddle) it seems like grid containers don't do anything smart about page breaks inside them and so rows reaching a page boundary just spill over onto the next page. A bit frustrating 😫

Are you aware of any way that one can inform the browser it may insert page breaks between rows?

FWIW; I'm running that JSfiddle on chrome 59 and safari 10.1.1 and seeing the same outcome.

Thanks very much David

rachelandrew commented 7 years ago

Hi David

I don't believe any browser has implemented fragmentation for grid yet (and the spec only has a rough draft of how that might work https://drafts.csswg.org/css-grid/#pagination).

I'd suggest however raising issues against the spec if you have particular use cases you are trying to make work.

Rachel

davidhewitt commented 7 years ago

Ah, neat - I also found Chrome's tracking ticket for fragmentation in grids at https://bugs.chromium.org/p/chromium/issues/detail?id=614667

I guess I will just have to wait this one out, I can make this part of the app work without grid for the moment. Thanks very much for pointing me in the right direction.