Hi all,

If you see the attachment, I have a footnote that starts on one page and ends on the other. I want to avoid that and keep the notes together, using "break-inside: avoid;" or "page-break-inside: avoid" on the element with the float footnote or the @footnote rule does not work.

Does anyone of you have an idea how I could avoid this behavior?

Best Regards
Andreas

1. breaking.footnote.png‎ 96.7 kB

Hi Andreas,

This works for me. Could you post the code that shows the problem?

Thanks,
Mark

Hi Mark,

The @footnote is in line 6, and the .note class in line 170 of the CSS code. The HTML for the note having the issue is in line 61.

Thanks for having a look
Andreas

1. index.html‎ 187.9 kB
2. style.css‎ 7.0 kB

Try this code:

.note {
  float: footnote;
  font-style: italic;
  break-inside: avoid;
}

Edited 6 Mar 2021 by howcome

Well, that was stupid from me, talking about break-inside and using break-before ^^

Thanks howcome, rechecking after your comment made me find this stupid mistake

I've made the same mistake many times :--)