CSS column-count Property

CSS column-count property divides the content of an element into the given number of columns. It takes an integer value as the number of columns.

In the example below, the content of the <div> element is divided into 3 columns. Try it out to see how it works:

Example:

div{
  column-count: 3;
}

CSS Syntax

The column-count property has the following syntax:

column-count: integer|auto|initial|inherit;

Property Values

The column-count property accepts the following values:

integerSpecifies the number of columns an element is divided into.
autoThis is the default value.
initialSets the column-count property to its default value(auto).
inheritInherits the column-count property from the parent element.

General Info

Default Valueauto
InheritedNo
JavaScript Usageelement.style.columnCount = “3”

Author

  • Manoj Kumar

    Hi, My name is Manoj Kumar. I am a full-stack developer with a passion for creating robust and efficient web applications. I have hands-on experience with a diverse set of technologies, including but not limited to HTML, CSS, JavaScript, TypeScript, Angular, Node.js, Express, React, and MongoDB.

Leave a Comment