columns

Applies an n-column layout using flex box.

Default Parameters:

Code

lp_column_dflts = {
'max_width': '1000px',  # max width per column - determines the min total width
'padding': '0',
'margin': '2%',
'custom_style': False,  # when set we do NOT include our Column Style, user must.
}

ColumnStyle = '''
@media screen and (min-width: %(min_total_width)s) {
.md-grid { max-width: initial;}
.lp-row { display: flex; }
.lp-column {
  padding: %(padding)s;
  margin-left: %(margin)s;
  margin-right: %(margin)s;
  flex: %(flex)s%%;
  max-width: %(max_width)s;
}
}
'''

https://github.com/AXGKl/docutools/blob/master/src/lcdoc/mkdocs/lp/plugs/column/__init__.py#L16

Mechanics

We format the html content like so

Before

mdblock1

`lp:columns <params>`

mdblock2

`lp:columns <params>`

mdblock3

After

<div class="lp-row">
    <div class="lp-column">
         html1 (rendered mdblock1)
    </div>
    <div class="lp-column">
         html2
    </div>
    <div class="lp-column">
        html3
    </div>
</div>

<style>
    User or default (flexbox) style base on above css classes.
</style>

Example