CSS Master

Figure 4.21. 15em wide columns inside a 45em wide container with column-gap: 0

Withcolumn-rule,wecanaddlinestovisuallyseparatecolumns.Itfunctions

similarlytoborder,andacceptsthesamevalues.Forexample:

.multi-col {

-webkit-column-rule: thin dashed #607d8b;

-moz-column-rule: thin dashed #607d8b;

column-rule: thin dashed #607d8b;

}

Likeborder,column-ruleisreallyashorthandforthecolumn-rule-width,column-

rule-style,andcolumn-rule-colorproperties.Eachcolumn-rule-*property

acceptsthesamevaluesasitsbordercounterpart,andisdemonstratedinFig-

ure4.22.

156 CSS Master