CSS reference manual

CSS @rules

CSS attribute大全

CSS3 column-rule attribute CSS3 column-fill attribute

CSS3 column-gap property usage and example

column-The gap CSS property specifies the spacing between columns in multi-column elements. If there is acolumn-ruleIt will appear in the middle of the gap.

The following table provides usage instructions and version history of this property, as well as its usage syntax in JavaScript scripts.

Default value:	normal
Applies to:	Multi-column elements
Inheritance:	No
Animatable:	are.Animation properties.
Version:	CSS3new feature
JavaScript syntax:	object.style.columnGap="50px"

column-The syntax of gap usage

The syntax of this property is as follows:

column-gap: | normal | initial | inherit

The following examples demonstrate how to use the column-gap property.

Example

p {
　　　　-webkit-column-gap:　50px;　/*　Chrome, Safari, Opera　*/
　　　　　　　-moz-column-gap:　50px;　/*　Firefox　*/
　　　　　　　　　　　　column-gap:　50px;　
}

Test and see‹/›

Property values

The following table describes the values of this property.

Value	Description
length	A length value that defines the spacing between columns. It cannot be negative, but can be equal to 0.
normal	Indicates the default spacing between columns defined by the browser. In most browsers, the default value is1em.
initial	Set this property to its default value.
inherit	If specified, the associated elements adopt the column of their parent element-Gap property values.

Browser compatibility

column-Browser compatibility of the gap property; the numbers in the table below represent the minimum version number of the browser that supports this property; all mainstream browsers support this property.

	Firefox 2+ ^-moz- Google Chrome 4+ ^-webkit- Internet Explorer 10+ Apple Safari 3.1+ ^-webkit- Opera 11.1+ ^-o-,15+ ^-webkit-