Grid-template - a shorthand property for defining grid columns, rows, and areas at once. With the value grid, every direct child will be in a grid context.
The parent will be in charge of defining the grid and the children will be in charge of positioning or aligning themselves in specific places, if necessary.ĭisplay - specifies the type of rendering box of an element. Now that you know the Grid concept, we are going to see the properties we need to shape our layout, distinguishing between the properties of the parent or child element.īeing the parent element, the one that contains one or more child elements that will be sized, aligned, layered and redistributed by the available space.
The grid layout allows us to align the elements in columns and rows, space the elements from the container element, position the child elements by overlapping them or forming layers, among other features. It is also known as the two-dimension layout system that provide us with the best alternative to the tables we used in the past, and has taken our user interfaces to the next level. The Grid layout is compatible with the vast majority of browsers, some like Opera Mini and IE do not support it, in Can I use you can see what properties are supported by which browsers. Grid ( CSS Grid Layout) is defined as a tool to divide a page into main regions or to define the relationship in terms of size, position and layer.
0 kommentar(er)
