How to increase the center margin when printing in 2 column landscape?

I’m wondering how I can change the print margins (most importantly the center margin) when printing in 2 column landscape mode. I want to cut the pages to create a spiral bound 5.5"x8.5" checklist but with the center margin being less than 1/4" it’s impossible. Any help would be greatly appreciated.

@admin (Jeff) Update: …The more I explore and use the MiraCheck Cloud features, the more impressed I am with the work you’ve done. A feature-rich, highly capable solution! Kudos! :smiley:

@Flyedouglas,

I’ve played around with the Advanced Printing feature on MiraCheck Cloud and cobbled up a 2-column landscape print template. To locate this feature, go into edit mode on a given checklist,
select the top-level “Name” on the left side, and on the right side, scroll down to “Advanced”. In Advanced, expand “Print Properties”.

Within “Print Properties” you can select the “Paste from Template” Button, and you will be presented with a list of pre-built templates. If you select one of these templates, the html of the template will be copied into the “Custom Template” edit box. Once copied, you can then select the “Preview Landscape” button above the edit box, and the checklist will be printed using the “Custom Template”.

The trick here is to modify a template (HTML/CSS) to achieve the desired print output, and then “SAVE” your Checklist. Once the Checklist is saved (with your Custom Template), this method can be used to later print your checklist. You can come into the Advanced Print Properties as described earlier to print using the custom template, or from your Checklist page, select the vertical ellipses (top right) on a checklist and select “Print Custom (Landscape)”.

Below is the template I’ve cobbled together, with a summary of the changes to (a copy of) the existing “miracheck-lists-columns-2-landscape”:

  • Trimmed the Style section to contain only the “.columns2” style
  • Added column-gap: 80px; to the “.columns2” style
  • Added width: 85%; to the “.list” style
  • Added margin-left: 40px; to the “.list” style
  • Added margin-right: 40px; to the “.list” style
  • Heavily modified the formatting of the template to line up the tags, while indenting the code blocks to make it easier to read
  • Removed all code that printed the Title Heading and Horizontal line beneath the heading as that doesn’t make sense if you’re going to cut the landscape page(s) in half after printing.

TODO: It would be nice to put (back) Jeff’s logo/MiraCheck, but onto each printed page, with a CheckList Title, above each column so it prints nicely no matter which 5.5" x 8.5" page you are looking at. …Any taker’s willing to tackle this are welcome! :slightly_smiling_face:

The template with my changes is below. You can copy/paste this template (as described above) to see how it works for you. You can play with the column-gap, width, margin-left, or margin-right as desired, directly in the “Custom Template” Edit box, re-printing each time, until you get something you like.

…Template provided AS-IS, no guarantees though… :wink:
Michael

Template for printing 2-column, Landscape, no Title, with 80px gap between columns

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />        
    <link rel="stylesheet" type="text/css" 
          href="http://fonts.googleapis.com/css?family=Roboto Condensed">
    <link rel="stylesheet" type="text/css" 
          href="http://fonts.googleapis.com/css?family=Poppins">
    
    <style>
      table {
          border-collapse: collapse;
      }
      
      table, th, td {
          border: 1px solid #aaaaaa;
      }
      
      td {
          padding: 2px;
      }
      
      .columns2 {
          -ms-column-count: 2;
          -moz-column-count: 2;
          -webkit-column-count: 2;
          column-count: 2;
          column-gap: 80px;
      }
      
      body {
          font-family: 'Roboto Condensed', serif; 
          margin: 0 0 0 0;
      }
      
      table, th, td {
          font-size: 10pt;
      }
      
      .header-font {
          font-family: 'Poppins'; 
          font-size: 16pt; 
          font-weight: bold;    
      }
      
      .level1-font {
          font-size: 12pt; 
          font-weight: bold; 
          text-align: center;  
          margin-bottom: 5px;
          padding: 3px;
          border-radius: 8px; 
      }
      
      .level2-font {
          font-size: 10pt; 
          font-weight: bold; 
          text-align: center;    
          padding: 3px; 
      }
      
      .item-label1-font {
          font-size: 10pt;     
      }
      
      .item-label2-font {
          font-size: 10pt;
          font-style: italic;
      }
      
      .item-label3-font {
          font-size: 10pt;   
          font-style: italic;
      }
      
      .item-label-container {
          padding-left: 3px; 
          padding-right: 3px;          
      }
      
      .list {
          margin-bottom: 25px;
          width: 85%;
          margin-left: 40px;
          margin-right: 40px;
      }
      
      .section {
          margin-bottom: 5px;
          width: 100%;
      }
      
      .item {
          margin-top: 2px;
          width: 100%;
          -webkit-column-break-inside: avoid; /* Chrome, Safari */
          page-break-inside: avoid;           /* Theoretically FF 20+ */
          break-inside: avoid-column;         /* IE 11 */
      }
      
      .comments {
          font-size: 10pt; 
          margin-top: 2px; 
          padding: 3px;             
      }
    </style>
  </head>
  
  <body>
    <div style="float: none; clear: both"/>
    <div class="columns2">
      {{for children}}  <!-- Loop thru Lists -->
        {{if !suppressPrint}}
          {{if printProperties && printProperties.breakBefore}}
            <div style="background-color: rgb(240,240,240); 
                        width:100%;
                        height:{{:printProperties.breakBeforeHeight}}px;
                        -webkit-column-break-after: always; 
                        page-break-after: always; 
                        break-after: column;">
              &nbsp;
            </div>
          {{/if}}    
          
          <div class="list" 
            {{if printProperties && printProperties.keepTogether}}
              style="-webkit-column-break-inside: avoid; 
                     page-break-inside: avoid; 
                     break-inside: avoid-column;"
            {{/if}}>
            
            <div class="level1-font" 
              style="{{if (printCustomProperties && 
                           printCustomProperties.backgroundColor && 
                           printCustomProperties.backgroundColor !== "#888888")}}
                       color: {{:printCustomProperties.color}}; 
                       background-color: {{:printCustomProperties.backgroundColor}}; 
                       border-color: {{:printCustomProperties.backgrouundColor}};
                     {{else name==="Emergency" || name==="EMERGENCY" || name==="emergency"}}
                       color: white; 
                       background-color: #cc0000; 
                       border-color: #cc0000;
                     {{else}}
                       color: white; 
                       background-color: hsl({{:#getIndex()*48+128}}, 100%, 25%); 
                       border-color: hsl({{:#getIndex()*48+128}}, 100%, 25%);
                     {{/if}}">
              {{:namePrint ? namePrint : name}}
            </div>  <!-- level1-font -->
            
            {{for children ~myIndex=#getIndex() ~listname=name}}  <!-- Loop thru Sections -->
              {{if !suppressPrint}}
                {{if printProperties && printProperties.breakBefore}}
                  <div style="background-color: rgb(240,240,240); 
                              width:100%;
                              height:{{:printProperties.breakBeforeHeight}}px;
                              -webkit-column-break-after: always; 
                              page-break-after: always; 
                              break-after: column;">
                    &nbsp;
                  </div>
                {{/if}}    
                
                <div class="section" 
                  {{if printProperties && printProperties.keepTogether}}
                    style="-webkit-column-break-inside: avoid; 
                           page-break-inside: avoid; 
                           break-inside: avoid-column;"
                  {{/if}}>
                  
                  <div class="level2-font" style=" 
                    {{if (backgroundColor && backgroundColor !== "#888888") && 
                         (borderColor && borderColor !== "#888888")}}
                      color: {{:color}}; 
                      background-color: {{:backgroundColor}}; 
                      border-color: {{:borderColor}};
                    {{else ~listname==="Emergency" || ~listname==="EMERGENCY" || ~listname==="emergency"}}
                      color: white; 
                      background-color: #cc0000; 
                      border-color: #cc0000;
                    {{else}}
                      color: white; 
                      background-color: hsl({{>~myIndex*48+128}}, 100%, 25%); 
                      border-color: hsl({{>~myIndex*48+128}}, 100%, 25%);
                    {{/if}}">
                    
                    {{:namePrint ? namePrint : name}}
                  </div>  <!-- level2-font -->
                  
                  {{for children}}  <!-- Loop thru Items -->
                    {{if !suppressPrint && type.startsWith("item")}}
                      {{if printProperties && printProperties.breakBefore}}
                        <div style="background-color: rgb(240,240,240); 
                                    width:100%;
                                    height:{{:printProperties.breakBeforeHeight}}px;
                                    -webkit-column-break-after: always; 
                                    page-break-after: always; 
                                    break-after: column;">
                          &nbsp;
                        </div>
                      {{/if}}    
                      
                      <div class="item" 
                        {{if printProperties && printProperties.keepTogether}}
                          style="-webkit-column-break-inside: avoid; 
                                 page-break-inside: avoid; 
                                 break-inside: avoid-column;"
                        {{/if}}>
                      
                        <div class="item-label-container" 
                          style="display: flex; 
                                 background-color: {{:labelOnly ? labelOnlyBackgroundColor : 'rgb(240,240,240)'}};
                                 {{if !labelOnly}}
                                   flex-direction: row; 
                                 {{else}}
                                   flex-direction: column; 
                                 {{/if}}
                                 justify-content: space-between; align-items: flex-start">
                          
                          <div class="item-label1-font" style="flex: 1; color: {{:color}};">
                            {{:label1Print ? label1Print : label1}}
                          </div>
                          
                          {{if label2 && label3}}
                            <div style="display: flex; flex: 1; flex-direction: column; align-items: flex-start;">
							
                              <div class="item-label2-font" style="flex: 1; color: {{:label2Color}};">
                                {{:label2Print ? label2Print : label2}}
                              </div>
							  
                              <div class="item-label3-font" style="flex: 1; color: {{:label3Color}}; margin-top: 10px">
                                {{:label3Print ? label3Print : label3}}
                              </div>
							  
                            </div> 
                          {{else}}    
                             <div class="item-label2-font" style="flex: 1; color: {{:label2Color}};">
                               {{:label2Print ? label2Print : label2}}
                             </div>
                          {{/if}}
                        </div>  <!-- Item Label container -->
                        
                        {{if comments && !suppressPrintComments}}
                          <div class="comments" style="background-color: rgb(240,240,240)">
                            <b>Comments</b><br/>
                            {{:comments}}
                          </div>                      
                        {{/if}}
                      
                      </div>  <!-- Item -->
                    
                      {{if printProperties && printProperties.breakAfter}}
                        <div style="background-color: rgb(240,240,240); 
                                    width:100%;
                                    height:{{:printProperties.breakAfterHeight}}px; 
                                    -webkit-column-break-after: always; 
                                    page-break-after: always; 
                                    break-before: after;">
                          &nbsp;
                        </div>
                      {{/if}}
                    
                    {{/if}}  <!-- End If suppressPrint (Items) --> 
                  {{/for}}  <!-- End loop for Section children (Items) -->
                </div>  <!-- Section -->
              
                {{if printProperties && printProperties.breakAfter}}
                  <div style="background-color: rgb(240,240,240); 
                              width:100%;height:{{:printProperties.breakAfterHeight}}px; 
                              -webkit-column-break-after: always; 
                              page-break-after: always; 
                              break-before: after;">
                  &nbsp;
                  </div>
                {{/if}} 
              
              {{/if}}  <!-- End If suppressPrint (Sections) -->    
            {{/for}}  <!-- End loop for List children (Sections) -->
          </div>  <!-- List -->
        
          {{if printProperties && printProperties.breakAfter}}
            <div style="background-color: rgb(240,240,240); 
                        width:100%;height:{{:printProperties.breakAfterHeight}}px; 
                        -webkit-column-break-after: always; 
                        page-break-after: always; 
                        break-before: after;">
              &nbsp;
            </div>
          {{/if}} 
        {{/if}}  <!-- End If suppressPrint (Lists) -->   
      {{/for}} <!-- End for columns2 children (Lists) -->
    </div>  <!-- columns2 -->
  </body>
</html>

@mobrien03 That worked! Thank you so much. I’ve been racking my brain trying to figure out how to make that happen. You did an excellent job with the template.

Now that you’ve helped me with one issue I’ve discovered another… I need to figure out if there is a way to offset the sections for printing. Being that there are two columns per page and I intend to print double-sided the columns don’t match up for that. In other words I need to figure out if there is a way to create a blank “dummy” column on some of the pages in order to make the columns match up correctly for double sided printing. Any ideas?

And just out of sheer curiosity what type of airplane/s do you use your Miracheck checklists for?

@Flyedouglas,

Glad that works! :sunglasses:

On the new question, I’m certainly not an expert— and I’m not sure I totally understand the objective.

However what does seem clear is that your objective is to change the output formatting when the printing is on the back of a double-sided, landscape page. To me, this means the template logic would need to keep track of its “state” (page count at a minimum), and “shift” either a margin width, or add some spacing to the sections in order to achieve your objective.

Then when the printing is back on the front of a double-sided landscape page, to revert things back to normal — and …rinse/repeat until the checklist is fully printed.

This also assumes that the order of each “half page” is proper so that once printed (either front or back), and then each landscape page is later “cut”, the sequence of pages is properly in the form of a “book” when all done. :slightly_frowning_face:

In my experience, this is not simple, nor easy – even professional print software made by businesses dedicated to book style printing (on two pages per sheet), don’t always get this right. …and honestly it makes my brain hurt to consider trying this with a landscape custom template (which requires post processing to cut them in half). :nerd_face:

To answer the other question, I fly a Van’s RV-7a that I built between 2006-2009. For my checklists, I print using the custom template with single-sided set on the printer. I then cut the landscape pages in half, and stuff them into Avery Heavyweight Diamond Clear Sheet Protectors for Mini Binders, 8.5" x 5.5", Acid-Free, 25ct (77004) https://www.amazon.com/dp/B000XKW45Q?ref=ppx_pop_mob_ap_share&th=1, and assemble (insert them) them front/back as required for the checklist flow. It works fine to have two sheets of paper in a single sheet protector, and (most of the time) allows for easy re-ordering without reprinting.

I then bind them with Loose Leaf Binder Rings 1-Inch (100 Pack) Office Metal Book Rings, Nickel Plated Steel Key Rings for School, Sliver https://www.amazon.com/dp/B07RN4QGW2?psc=1&ref=ppx_yo2ov_dt_b_product_details

I try to avoid the whole problem of trying to make a double-sided printing process print/collate things properly - especially when you need to cut the landscape pages when done.:smirk:

HTH,
Michael

(Update: I just realized that you may be binding your checklist on the short (top) edge? Is your issue with columns of Items misaligning when a Section with Items page break onto the backside, before the end of the Items list? …Hmmm, maybe create a copy/one-off checklist with a smaller group of pages that include your Items that page break, and change the column-gap to adjust the left-right spacing of the target page? Then after printing/cutting, manually combine/replace those back into your main checklist? Regardless of binding the long or short edge, this “Poor Man’s” approach could work. …that’s all I got :crazy_face: )