yzane / vscode-markdown-pdf

Markdown converter for Visual Studio Code
https://marketplace.visualstudio.com/items?itemName=yzane.markdown-pdf
Other
999 stars 204 forks source link

Print Two-Columns Document to PDF #159

Open YoshiRi opened 4 years ago

YoshiRi commented 4 years ago

Thank you for your great package.

I want to print two-columns document to PDF.

Though it can be properly shown in Markdown preview and html conversion, pdf conversion seems to be not supporting two column printing. Do you have any plan to support this in the future?

<style>
.column-left{
  float: left;
  width: 47.5%;
  text-align: left;
}
.column-right{
  float: right;
  width: 47.5%;
  text-align: left;
}
</style>

<div class="column-left">

# text A
</div>
<div class="column-right">

# text B
</div>
hackslashdave commented 2 years ago

If you use a css file when saving you can simple add

body{ column-count: 2; }

habakan commented 1 year ago

Although I occured same issue, I found the essential problem is corruption of html block written in the markdown file in converting #119. I resolved using block of markdown-it-container.

<style>
  .column-left{
    float: left;
    width: 50%;
    text-align: left;
  }
  .column-right{
    float: right;
    width: 50%;
    text-align: left;
  }
</style>

::: column-left
# text A
:::

::: column-right
# text B
:::
hanggrian commented 1 year ago

If you use a css file when saving you can simple add

body{ column-count: 2; }

Thanks @hackslashdave. This solution works, but content is evenly distributed. Can it be modified so that leftmost columns are filled first?

Screenshot 2023-04-13 at 9 40 49 PM

bingsanyu commented 1 month ago
@media print {
    #write {
        column-count: 2;
        column-gap: 0.2cm; /* Adjust the gap between columns as needed */
        padding: 0 0.2cm !important; /* Update padding if necessary */
        margin: 0 !important;
    }
}

Add this to the css file; it works for me.