Creating Two-Column Layouts in Markdown to PDF

A two-column layout is the standard format for academic journals, IEEE publications, and professional newsletters. While Markdown compiles into a single continuous stream of text by default, you can easily adapt your document structure to format multi-column layouts during export.

In this guide, we’ll demonstrate how to set up a two column layout markdown to pdf compilation using CSS Columns for HTML-to-PDF generators and LaTeX directives for Pandoc.

Why Use a Two-Column Layout?

Double-column layouts are useful for:

• Academic Submissions: Meeting formatting requirements for conferences (IEEE, ACM, etc.).
• Reading Efficiency: Shorter line lengths improve readability by making text scanning faster.
• Space Optimization: Compact layouts reduce empty white space on pages, saving paper when printed.

Method 1: CSS Columns (For Web-to-PDF Converters)

If you are using a PDF generator that renders HTML pages via CSS (such as Weasyprint or headless Chromium), CSS Columns is the cleanest method to format text across multiple columns dynamically.

Basic CSS Column Syntax

You can wrap the content you want divided into a container and apply the columns property. In your Markdown, you can write:

<div class="two-columns">
This text will automatically flow into two columns. Once the first column is full, the remaining content will flow into the second column. You can place paragraphs, lists, and images inside this container.
</div>

Then, define the style in your CSS stylesheet:

.two-columns {
  column-count: 2;
  column-gap: 20px;       /* Margin space between columns */
  column-rule: 1px solid #ccc; /* Optional divider line */
  text-align: justify;
}

Column Spans and Breaking Controls

To make certain elements (like a title or a major figure) span across both columns, use the column-span property:

.span-full {
  column-span: all;
}

To prevent heading elements from splitting or to force a column break, you can use:

h3 {
  break-inside: avoid;
}

.force-col-break {
  break-before: column;
}

Method 2: Pandoc and LaTeX Templates (For Academic Papers)

If you compile your Markdown using Pandoc and a LaTeX compiler, the configuration is different.

Using the classoption: twocolumn in YAML

The simplest way to make your entire document double-columned is to set the class option in your YAML frontmatter. Pandoc’s default LaTeX template recognizes this parameter:

---
title: "An Analysis of Double-Column Structures"
author: "Author Name"
documentclass: article
classoption: twocolumn
---

When you compile using pandoc document.md -o document.pdf, the output will automatically be rendered in a professional, double-column academic format.

Creating Multi-Column Blocks with Pandoc Divs

If you only want certain sections of your paper to have two columns, you can use the pandoc-columns filter or native LaTeX environments in Markdown:

Here is some introductory text in one column.

\begin{multicols}{2}
This text inside the multicols environment will be formatted into two columns. 
You can use standard Markdown inside this block as long as the compiler parses it.
\end{multicols}

Back to a single column layout here.

Note: Ensure you include \usepackage{multicol} in your LaTeX header-includes metadata.

Method 3: CSS Flexbox and Grid for Grid-based Sections

For side-by-side elements like a chart alongside a textual explanation, CSS Grid or Flexbox works best:

<div class="row">
  <div class="column">Column 1 content...</div>
  <div class="column">Column 2 content...</div>
</div>

.row {
  display: flex;
  gap: 15px;
}
.column {
  flex: 1;
}

Create Professional Multi-Column Layouts

Adjusting column sizes and rules makes your documents look polished and easy to read. To experiment with custom CSS columns, grids, and templates with live rendering, try our Markdown to PDF Editor.