Re: [css-break] avoid-* conflicts

On 03/22/2015 05:33 PM, Brady Duga wrote:
> I don’t understand how the various ‘avoid’ values work. If I
> have a <div class=’samecolumn samepage’> with the css:
>
> .samecolumn {break-inside: avoid-column;}
> .samepage {break-inside: avoid-page;}
>
> Are column breaks allowed (or at least not avoided) inside that
> block? Or is this a tri-state setting, where specific avoids
> just change the setting for that class of break? Is it possible
> to avoid 2 types of breaks while allowing another? It seems
> like the value would have to be a list to allow that.

Ah, you're running into a cascading problem here. The second rule
overrides the first, so we're only avoiding page breaks here.

Probably what you want is this additional rule:
   .samecolumn.samepage { break-inside: avoid-column avoid-page; }

It might make sense to allow multiple values here. I'll bring it
up with the WG; we'll either accept it now, or defer to the next
level. (I don't see any problems with it, but it is a feature
request, and we're more-or-less feature-frozen atm.)

Wrt use cases, simply saying 'break-inside: avoid' should do in
most cases.
     .samecolumn.samepage { break-inside: avoid; }

~fantasai

Received on Monday, 18 May 2015 04:13:57 UTC