Horje
grid template areas Code Example
grid template areas 
/* Keyword value */
grid-template-areas: none;

/* <string> values */
grid-template-areas: "a b";
grid-template-areas: "a b b"
                     "a c d";

/* Global values */
grid-template-areas: inherit;
grid-template-areas: initial;
grid-template-areas: unset;
Source: developer.mozilla.org
grid template areas 
#page {
  display: grid;
  width: 100%;
  height: 250px;
  grid-template-areas: "head head"
                       "nav  main"
                       "nav  foot";
 
}

#page > header {
  grid-area: head;
  background-color: #8ca0ff;
}

#page > nav {
  grid-area: nav;
  background-color: #ffa08c;
}

#page > main {
  grid-area: main;
  background-color: #ffff64;
}

#page > footer {
  grid-area: foot;
  background-color: #8cffa0;
}
Source: developer.mozilla.org
grid template areas 
css grid
grid-template-areas 
wrapper {

    display: grid;

    grid-template-columns: repeat(9, 1fr);

    grid-auto-rows: minmax(100px, auto);

    grid-template-areas:

      "hd hd hd hd   hd   hd   hd   hd   hd"

      "sd sd sd main main main main main main"

      "ft ft ft ft   ft   ft   ft   ft   ft";

}
Source: blog.duda.co
how to use a blank space with grid template areas css 
.container {
  display: grid;

  grid-template-columns: 2fr 2fr 1fr 2fr;
  grid-template-rows: 100px 200px 100px;

  grid-template-areas:
    "head head . side"
    "main main . side"
    "footer footer footer footer";
}
Source: alligator.io



Css

Related
ubuntu toggle always on top Code Example ubuntu toggle always on top Code Example
css chat Code Example css chat Code Example
how to make all buttons same size css Code Example how to make all buttons same size css Code Example
css add shade over background image Code Example css add shade over background image Code Example
showing danger message in red in terminal bash Code Example showing danger message in red in terminal bash Code Example

Type:
 Code Example
Category:
 Coding
Sub Category:
 Code Example
Uploaded by:
 Admin
Views:
 10



 

Horje