CSS3 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

Internet Explorer Firefox Opera Google Chrome Safari

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  



SHARE THIS PAGE

COLOR PICKER

colorpicker