Template:hcol/styles.css

.ac-hcoln+*, .ac-hcoln+*  {display: inline-block; column-gap: 32px;} .ac-hcoln+ol, .ac-hcoln+ul {background: #F8F8FF; margin-left: 0; padding-left: 24px; padding-right: 24px;}

.ac-hcol2+* {column-count: 2;} .ac-hcol3+* {column-count: 3;} .ac-hcol4+* {column-count: 4;} .ac-hcol5+* {column-count: 5;}

.ac-hcoln+ol > li > ol, .ac-hcoln+ol > li > ul, .ac-hcoln+ul > li > ul, .ac-hcoln+ul > li > ol { break-inside: avoid; }

/* https://www.w3schools.com/cssref/css3_pr_mediaquery.asp */ /* https://stackoverflow.com/questions/6370690/media-queries-how-to-target-desktop-tablet-and-mobile */ @media only screen and (max-width: 640px) { .ac-hcoln+* {column-count: 1;} .ac-hcoln+ol, .ac-hcoln+ul {background: initial;} }

/* https://stackoverflow.com/questions/952861/targeting-only-firefox-with-css */ /* https://stackoverflow.com/questions/7785374/how-to-prevent-column-break-within-an-element */

/* wiki-unwritable @-moz-document url-prefix { .ac-hcoln+ol > li, .ac-hcoln+ul > li { display: table; position: relative; }	.ac-hcoln+ul > li::before, .ac-hcoln+ol > li::before { content: ""; display: list-item; position: absolute; top: 0; left: 0; } }