Home → Problems →

Trouble with @print

• Edit

fredrik.stl

28 Nov, 2012 06:47 AM

Can't get the following to work:

p, h2, h3 {
    orphans: 3;
    widows: 3;
}
h1, h2, h3{
    page-break-after: avoid;

}

Any clues? Tried to put it under a @page tag as well, but that didn't work either. Marked just won't apply the code.
Known bug? Missing feature?

Really would like to be able to push headings to the next page and not have them orphaned. The same goes with widows and orphans of paragraphs.

1. Support Staff 1 Posted by Brett on 28 Nov, 2012 02:22 PM

   

   @print isn't recognized in the current version of webkit that Xcode uses, use media queries instead. I don't know how much luck you'll have with orphans and widows, either, but page-break-after and page-break-before will work. There's a setting in preferences to make headlines start on new pages automatically, too.

   • Edit

2. 2 Posted by fredrik.stl on 28 Nov, 2012 04:14 PM

   

   I'm using the @media query, sorry for the confusion there, meant that...

   I use the setting to make headlines start on a new page. But this is only something I wan't to apply to h1. For h2 and so forth I need them to start on a new page only if it otherwise means they will be orphaned (ie on the bottom of a page).

   As I said. Had no luck with:

   h1, h2, h3{

   page-break-after: avoid;
   

   this is my full print-code

   @media print {

   body {
       overflow: auto;
       orphans: 3 !important;
       widows: 2 !important;
   }
   
   img,pre,table,figure {
       page-break-inside: avoid;
       }
   
   h1, h2, h3 {
       page-break-after: avoid;
   }
   
   p, {
       orphans: 3;
       widows: 3;
   }
   
   #wrapper {
       background: #fff;
       color: <a href="/discussions/problems/303030" title="Discussion #303030">#303030</a>;
       font-size: 90%;
       padding: 10px;
       position: relative;
       text-indent: 0;
   }
   

   }

   • Edit

3. Support Staff 3 Posted by Brett on 28 Nov, 2012 08:04 PM

   

   I'm afraid I don't have enough time right now to do extensive CSS experimentation on this. I can tell you that Marked is using the standard webkit rendering system and printing is all done through the webkit system. If you can get it to work in Safari, it should work in Marked. If I have time to look into this particular use case further, I definitely will.

   • Edit

4. 4 Posted by fredrik.stl on 05 Dec, 2012 10:13 PM

   

   Hi Bret! I understand that your time is limited. And I also realize now that this is mainly a problem with webkit.

   What I like to suggest though is this, and you yourself has also pointed this out: A large portion, maybe even a majority of marked users is not bloggers first and foremost. A lot of your users is actually writers in other capacities.

   To further develop marked to accustom the needs for print/pdf would be something really great.

   Hence I'd like to give some suggestions:

   1. To solve the widow and orphan problem. It would mean a lot. And I mean A LOT. If marked could be able to define the number of lines on the start as well as the end of a page (or else apply page-break)

   2. To have some elements not only begin with a page-break, but also some elements to properly have a page break before them, if and only if, they otherwise would be orphaned. This applies to heading (for instance h2) that need to be at the same page as their following paragraphs but where you don't wan't them to allways appear at the start/top of a page.

   3. To be able to set different margins for headers depending on if it's margin relative to a a paragraph or the top of a page.

   This types of settings, as I see it, is crucial to decent typography for print. And would be a real killer to see in marked!

   I hope you understand we're I'm getting although me not having english as my native language. I love marked. A lot. But I also see tremendous potential for marked becoming a crucial companion app for writers hooked up on the beauty of markdown.

   Cheers!

   • Edit

5. Support Staff 5 Posted by Brett on 05 Dec, 2012 10:19 PM

   

   I understand what you're asking for, but this is typesetting and page layout and not something that I imagine Marked or Markdown ever being capable of. If you need this level of fine-grained control, you're going to need to use a word processor, that's just the reality. I'm working on a new print system, but I can't make any promises that these requirements will be met.

   • Edit

6. 6 Posted by Jim on 12 Jan, 2014 06:02 AM

   

   Shoot! I really need this to work as well. I know you didn't plan on using this as a typesetting sort of thing, but perhaps it has grown there? I too can't get the page-break-after:avoid css to work...is there any chance you could look into this?

   • Edit

7. 7 Posted by Amil on 28 Jan, 2014 05:06 PM

   

   Is there any news on this front? I have very similar code, "break-after: avoid" under "@media print" doesn't work for me. (I'm using Mavericks, Marked 1.)

   • Edit

8. Support Staff 8 Posted by Brett on 29 Jan, 2014 03:47 PM

   

   page-break-after doesn't work on headlines. You have to include an empty block element to generate a page break.

    <div style="page-break-after:always"><span style="display:none">&nbsp;</span></div>
   

   I've found this to be true in most browsers.

   • Edit

9. 9 Posted by Scott Granneman on 27 May, 2021 07:05 PM

   

   I see one problem—you have a comma after your p selector. Also, you have HTML as the value of the color property, but that could be from this forum software.

   • Edit