Разрыв печати Css media внутри: избегайте перекрытия со следующим divCSS

Разбираемся в CSS
Ответить
Anonymous
 Разрыв печати Css media внутри: избегайте перекрытия со следующим div

Сообщение Anonymous »


Я пытаюсь не обрезать div между страницей во время печати и в предварительном просмотре печати, поэтому я добавил break-inside: избежать;, но он не работает должным образом (похоже, включен фаерфокс).

.main-content, .section { дисплей: гибкий; гибкое направление: столбец; разрыв: 3 пикселя; } .раздел { граница: 2 пикселя, сплошная синяя; } .sub-контент { поле: 2 пикселя; граница: 2 пикселя, сплошной темно-оранжевый; } @media печать { п { взлом внутрь: избегать; } Печать Вершина Середина подконтент 1 подконтент 2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque tempus diam и sem pharetra, eu imperdiet turpis pellentesque. Nulla ut nisi sapien. Donec sit amet auctor Massa, not congue elit. Имеющиеся язвы могут стать причиной заражения. Suspendisse aliquet hendrerit dictum. Duis nec laoreet dui. Duis tempor mi a Massa Maximus Bibendum. Phasellus ornare bibendum dui, ut ornare ex sagittis in. Suspendisse dignissim magna quis ligula auctor, in Malesuada Felis Tincidunt. Morbi rutrum augue vulputate, sollicitudin ipsum id, imperdiet felis. Sed nec orci fringilla, porta dui vitae, Placerat velit. Morbi lacus elit, ornare id tempus in, ornare non odio. Donec ultrices euismod magna, ut vehicula tortor pulvinar in. Morbi maximus, libero vitae convallis sodales, dui neque tempor urna, at faucibus quam libero sit amet urna. Vivamus ut vulputate odio. Duis bibendum sed enim non posuere. Donec lobortis, sapien non hendrerit dapibus, nibh leo auctor lorem, id facilisis eros Tellus a metus. Класс aptent tacitisociasquadlitoratorentperconubianostra,perinceptoshimenaeos. Suspendisse eget porta sem, сидеть с беременной женщиной. Cras vulputate felis vitae ultrices Malesuada. Aliquam nulla metus, dapibus et tempus id, laoreet ut nunc. Nam diam nunc, blandit vel posuere vel, ultricies ac orci. Меценат не эрос, euismod id pellentesque vel, eleifend quis felis. Nulla tempus dolor a turpis pellentesque, non fringilla Massa Egestas. Praesent ullamcorper sem ut felis dignissim, nec condimentum nisl cursus. Аликвам эрат волутпат. Меценат и felis egestas mi egestas lacinia et fringilla ligula. Пеллентескный житель morbi tristique senectus et netus et Malesuada Fames ac turpis egestas. Sed congue vitae enim fringilla tempor. Nulla eu lectus sit amet Tellus commodo porta vitae в Нисле. Nullatincidunt Placerat lorem, iaculis eleifend augue maximus sed. Donectincidunt augue sed pharetra pretium. Phasellus varius faucibus mauris, eget convallis metus pellentesque, не включенный в другие категории. Vivamus elementum, mauris ut posuere porta, ipsum odio posuere velit, et molestie urna tortor id nunc. Nullam actortor interdum, suscipit diam id, rutrum felis. Nulla condimentum libero vel sem aliquam porttitor. Эней posuere imperdiet ex at bibendum. Donec sed Fermentum ligula. Sed et viverra nulla, vitae tempus nulla. Nulla consequat mi ut nisl dictum, consequat pharetra ex posuere. Donec aliquam eleifend enim, rhoncus tristique lacus mattis gravida. Нуллам ligula ante, aliquet сидеть amet aliquet a, tempor at Erat. Suspendisse et magna quis ligula ultrices вестибулум максимус вел лорем. Quisque iaculis luctus velit fringilla congue. Sed lacinia neque non congue eleifend. In nec libero nibh. Aliquam condimentum sed magna ac scelerisque. Sed sit amet elementum Massa, sed Placerat nunc. Donec congue magna commodo metus dapibus efficitur. Этиам вел либеро нон нулла фауцибус лаореет и ут велит. Proin eget quam ante. Нам не причиняют вреда больше всего, eu vehicula quam. Nunc нон дуги элит. Nam felis magna, iaculis eu cursus sit amet, posuere non orci. Fusce convallis, eros vitae laoreet sodales, lacus tortor accumsan dui, commodo maximus justo eros vitae velit. Aliquam ornare Malesuada nibh, nec ornare enimtincidunt id. Pellentesque pharetra venenatis hendrerit. Этиам ут интердум арку. Sed venenatis, augue ac feugiat vehicula, nibh ex tristique magna, a Placerat ex lacus vitae libero. Duis nec libero nec nibh pharetra scelerisque. In feugiat, ligula et molestie luctus, diam enim lacinia leo, eget interdum lacus ligula at augue. Приостановить потенцию. Suspendisse molestie odio elit, condimentum viverra orci vehicula eu. Donec id nisl quis metus feugiat condimentum. Целое число, nibh eu semper dapibus, urna nulla finibus lectus, sed actor nisl Massa Nec Massa.
подконтент 3 Нижний
Ожидается, что подконтент 2 будет расти на второй странице, чтобы полный текст находился на той же странице предварительного просмотра.

Кажется, что в Chrome это работает так, как ожидалось, но не в Firefox, и мне трудно понять, почему. Я предполагаю, что это проблема совместимости с некоторыми инструкциями, но когда я проверяю возможность использования взлома, кажется, что он совместим.
Предварительный просмотр Chrome Предварительный просмотр Firefox
Изображение

Изображение

Изменить: я открыл ошибку в Firefox здесь 1855702
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»