Column Gap CSS Property is used in the Columns property. The Column Gap is used to represent the gap between the each column. Browser default add the Column Gap Default Size is 1em. If you want to increase, decrease the Column Gap Value you can do on the Column-gap property.
Syntax:
.clum{
-webkit-column-gap:2em;
-moz-column-gap:2em;
Column:gap:2em;
}Example Code:
CSS:
.clum {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-gap: 2em;
-moz-column-gap: 2em;
column-gap: 2em;
}HTML:
<div class="clum"> <p>Column Count used to give the value for number column will present in the page</p> <p>Column Count used to give the value for number column will present in the page</p> <p>Column Count used to give the value for number column will present in the page</p> </div>
Preview:
Column Count used to give the value for number column will present in the page
Column Count used to give the value for number column will present in the page
Column Count used to give the value for number column will present in the page
| Feature | Chrome | Firefox | IE | Opera | Safari | Android | IOS |
|---|---|---|---|---|---|---|---|
| Basic support | Any Version | 1.5+ | 10+ | 11.1+ | 3+ | 2.3+ | 6.1+ |
