Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Èròjà atẹ̀lélànà yii ni a ti fi pamọ́ fọ́jọ́ pípẹ́. Jọ̀wọ́ béèrè ìbéèrè titun bí o bá nílò ìrànwọ́.

Does Firefox support break-after: avoid?

  • 5 àwọn èsì
  • 1 ní ìṣòro yìí
  • 101 views
  • Èsì tí ó kẹ́hìn lọ́wọ́ jdablin

more options

I'm creating a print stylesheet, and trying to use break-after: avoid to keep headings on the same page as the following paragraph, but it doesn't seem to work.

To investigate, I created a simple page with an

in between a number of paragraphs to that the <h2> printed as the last item on the page. I then added the following styles. @media print { h2 { break-after: avoid; } } I expected the heading to move to the next page, but nothing happened. So then I added the following: CSS: @supports (break-after: avoid) { .message { display: block; } } HTML:

break-after: avoid is supported.

When I refreshed the page, the message appeared. So is break-after supported or not, or is it not supported for paged media? Or if it is supported, what am I doing wrong? MDN suggests it's been supported since Firefox 65, but maybe I'm misunderstanding the compatibility table.

Thanks in anticipation. If this is the wrong forum to ask this question, perhaps somebody could direct me to the correct one.

I'm creating a print stylesheet, and trying to use break-after: avoid to keep headings on the same page as the following paragraph, but it doesn't seem to work. To investigate, I created a simple page with an <h2> in between a number of paragraphs to that the <h2> printed as the last item on the page. I then added the following styles. @media print { h2 { break-after: avoid; } } I expected the heading to move to the next page, but nothing happened. So then I added the following: CSS: @supports (break-after: avoid) { .message { display: block; } } HTML: <p class="message">break-after: avoid is supported.</p> When I refreshed the page, the message appeared. So is break-after supported or not, or is it not supported for paged media? Or if it is supported, what am I doing wrong? MDN suggests it's been supported since Firefox 65, but maybe I'm misunderstanding the compatibility table. Thanks in anticipation. If this is the wrong forum to ask this question, perhaps somebody could direct me to the correct one.

Ọ̀nà àbáyọ tí a yàn

This forum is for end user support, so not really the right place to ask :-) but https://bugzilla.mozilla.org/show_bug.cgi?id=775617 being unresolved suggests this isn't expected to work.

Ka ìdáhùn ni ìṣètò kíkà 👍 0

All Replies (5)

more options

Sorry, it looks like my question has made the display go mad, I hope you can make sense of it.

more options

Ọ̀nà àbáyọ Tí a Yàn

This forum is for end user support, so not really the right place to ask :-) but https://bugzilla.mozilla.org/show_bug.cgi?id=775617 being unresolved suggests this isn't expected to work.

more options

On my own sites I user the older method of putting the heading and first paragraph following in a div styled with:

page-break-inside: avoid;

Not the best design, but possibly useful in some cases.

more options

Thank you, that's a shame. It's curious that @supports suggests it should work, and MDN is ambiguous too. Maybe that bug report will get fixed one day, we can but hope.

more options

To jscher2000: thanks for the suggestion, I might try that.