<style>
    body {
        -webkit-writing-mode: vertical-rl;
    }

    div.columns {
        -webkit-columns: 2;
        -webkit-column-rule-color: gray;
        -webkit-column-rule-width: 12px;
        -webkit-column-fill: auto;
        columns: 2;
        column-rule-color: gray;
        column-rule-width: 12px;
        column-fill: auto;
        width: 200px;
        height: 20px;
        display: inline-block;
    }

    div.columns div {
        width: 400px;
    }
</style>

<div class="columns" style="-webkit-column-rule-style: solid; column-rule-style: solid;">
    <div></div>
</div>

<div class="columns" style="-webkit-column-rule-style: dotted; column-rule-style: dotted;">
    <div></div>
</div>

<div class="columns" style="-webkit-column-rule-style: dashed; column-rule-style: dashed;">
    <div></div>
</div>

<div class="columns" style="-webkit-column-rule-style: groove; column-rule-style: groove;">
    <div></div>
</div>

<div class="columns" style="-webkit-column-rule-style: ridge; column-rule-style: ridge;">
    <div></div>
</div>

<div class="columns" style="-webkit-column-rule-style: inset; column-rule-style: inset;">
    <div></div>
</div>

<div class="columns" style="-webkit-column-rule-style: outset; column-rule-style: outset;">
    <div></div>
</div>

<div class="columns" style="-webkit-column-rule-style: double; column-rule-style: double;">
    <div></div>
</div>