What is the CSS column-span property?

The column-span property in CSSCascade Style Sheets is used to define how we want to span the content across multiple columns when we are using a multi-column layout.

Syntax


column-span: none|all|initial|inherit;

Property values

  • none: This is the default value. It is used to specify that the element should span across only one column.

  • all: It is used to specify that the element should span across all the columns.

  • initial: This sets the value to its default value.

  • inherit: This inherits property from its parent value.

Code

The following is the basic HTMLHyperText Markup Language & CSS code to demonstrate the use of the column-span property:

Explanation

In this example, we can see that we have made 2 columns and we span the content between these two columns.

We can also make more columns and span the content between multiple columns.

Free Resources