Skip to content
This repository has been archived by the owner on Jun 9, 2022. It is now read-only.

Break before/after feature #19

Open
ainth opened this issue Aug 12, 2013 · 2 comments
Open

Break before/after feature #19

ainth opened this issue Aug 12, 2013 · 2 comments

Comments

@ainth
Copy link

ainth commented Aug 12, 2013

Hey,

I'm working on something that requires hard breaks at certain points in the column flow. This is effectively the CSS3 break-before and break-after feature. I've been hacking away at it for quite some time but can't seem to wrap my head around things well enough to pin down how/where to implement it. Definitely something I need so I'll keep working on it but would be a great addition to the library as well.

Here's where I am now: https://gist.github.com/ainth/6214775. There's small bits of code elsewhere but I'm guessing most of the work has to happen in _addFlowedElement

What I'm trying to do is something like "if we see a force break class on the element, forcibly finish wrapping the preceding content". The problem is that when this happens certain columns have their content cut off (some elements don't wrap as expected). I'm using lots of nowrap and keepwithnext so I'm thinking it might have something to do with those?

@georgecrawford
Copy link
Contributor

Hmm. I'm having trouble visualising your requirements. Could you perhaps set up a jsbin/Codepen example which demonstrates some existing content before your attempted fix, and explain what you want to change about the rendering?

@mikkelvp
Copy link

mikkelvp commented Apr 9, 2018

@georgecrawford

Old issue, but i've just discovered this library and also have a need to break columns.
I've made codepens. One with @ainth's code added.

Without break: https://codepen.io/anon/pen/jzXGaW
With break: https://codepen.io/anon/pen/mxaBqv

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants