The **`column-span` property** in #key# CSS: Cascade Style Sheets #key# is used to define how we want to span the content across multiple columns when we are using a multi-column layout.

# 
#  Syntax

---
```css
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 #key# HTML: HyperText Markup Language #key# & CSS code to demonstrate the use of the column-span property:

<title>Example</title>

<div class="col">
  <h3>Welcome To Educative Edpresso Shots. </h3>
  <p>It is a platform where you can learn different types of programming skills.</p>
  <p>You can go through different shots which are based on different programming languages to enhance your skills.</p>
</div>

.col 
{
  background: rgb(236, 236, 231);
  padding: 5px;

  column-count: 2; 
  column-rule: 4px dotted rgb(221, 110, 70);
}

.col h3 
{
  column-span: all;
}

codemirror


## 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.

What is the CSS column-span property?

Defines content spanning across columns using multi-column layouts with values none, all, initial, inherit.