css grid layout

Which of the following is most suitable for a grid layout?

• toolbar

• form

• menu

• complex layout, like a newspaper

Which model includes margin, border, padding, and content?

• CSS Box model

• CSS3 Flexbox Box model

• CSS3 Grid Layout model

• CSS Grid Template Layout Module

Which model defines structures similar to tables using 2 dimensions?

• CSS Box model

• CSS3 Flexbox Box model

• CSS3 Grid Layout model

• CSS float

You are creating a grid layout. What does 1fr mean in the following code?

grid-template-columns: 150px 150px 1fr 1fr;

• The first two columns will be two fraction units of the stated width.

• The third and fourth columns is 1 fraction unit of the remaining space in the grid.

• The second column will be double the stated width.

• The second column will be half of the remaining space in the grid.

How many columns and rows are defined in the following code?

section {

display: grid;

grid-template-columns: 100px 1fr 1fr 250px;

grid-rows: 50px 1fr 1fr ;

}

section header {

grid-column: 1 / 4;

grid-row: 1;

}

section nav {

grid-column: 1;

grid-row: 2 / 3;

}

section article {

grid-column: 2;

grid-row: 2;

}

section aside {

grid-column: 3;

grid-row: 2;

}

section footer {

grid-column: 1 / 4;

grid-row: 3;

}

• 1 rows and 2 columns

• 2 rows and 3 columns

• 3 rows and 2 columns

• 3 rows and 4 columns