CSS grid-columns Property
Example
Add one grid line in the middle of the div element, another one 200 pixels from the right, and another one in the middle of remaining space:
div
{
grid-columns:50% * * 200px;
}
Browser Support
The grid-columns property is not supported in any of the major browsers.
Definition and Usage
The grid-columns property specifies the width of each column in the grid.
Tip: Using grid systems is a great value for print designers. Now the same concept is applied to online content. The grid properties add capabilities for sizing and positioning headings, text, and images in a scalable grid.
| Default value: | none |
|---|---|
| Inherited: | no |
| Version: | CSS3 |
| JavaScript syntax: | object.style.gridColumns="50% * * 200px" |
CSS Syntax
grid-columns: length|%|none|inherit;
| Value | Description |
|---|---|
| length | Refers to the grid of the containing block |
| % | Refers to the width of the containing block |
| none | |
| inherit |
