Generated by SassMeister.com.

SassMeister-input-HTML.html

<ul><li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>

<li class="primary">Mercedem aut two</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>
<li>in diem</li>

<li class="primary">Mercedem aut three</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>in diem</li>
<li>certam indicere</li>
<li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>
<li>in diem</li>
<li>certam indicere</li>
<li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>
<li>in diem</li>
<li>certam indicere</li>
<li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>
<li>in diem</li>
<li>certam indicere</li>
<li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>certam indicere</li>
</ul>

SassMeister-input.scss

// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// ----

ul{
   -webkit-column-count: 7; /* Chrome, Safari, Opera */
 -moz-column-count: 7; /* Firefox */
 column-count: 7;
}
.primary{
 color: RED;
 -webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
  page-break-inside: avoid; /* Firefox */
  break-inside: avoid; 
  padding: 1em;
  background: salmon;
 
}

SassMeister-output.css

ul {
  -webkit-column-count: 7;
  /* Chrome, Safari, Opera */
  -moz-column-count: 7;
  /* Firefox */
  column-count: 7;
}

.primary {
  color: RED;
  -webkit-column-break-inside: avoid;
  /* Chrome, Safari, Opera */
  page-break-inside: avoid;
  /* Firefox */
  break-inside: avoid;
  padding: 1em;
  background: salmon;
}

SassMeister-rendered.html

<ul><li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>

<li class="primary">Mercedem aut two</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>
<li>in diem</li>

<li class="primary">Mercedem aut three</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>in diem</li>
<li>certam indicere</li>
<li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>
<li>in diem</li>
<li>certam indicere</li>
<li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>
<li>in diem</li>
<li>certam indicere</li>
<li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>totius Galliae</li>
<li>in diem</li>
<li>certam indicere</li>
<li class="primary">Mercedem aut</li>
<li>nummos unde</li>
<li>unde extricat</li>
<li>amaras</li>
<li>Petierunt uti</li>
<li>sibi concilium</li>
<li>certam indicere</li>
</ul>