Modern HTML and CSS from the Beginning (Including Sass) - Grid Basics & Columns

What is the primary purpose of setting 'display: grid' on a parent element?

• To make the parent element a flex container

• To convert child elements into grid items

• To apply a default margin to child elements

• To automatically align text within the parent

Which CSS property is used to define the number and width of columns in a grid?

• grid-template-rows

• grid-auto-flow

• grid-gap

• grid-template-columns

What does the 'auto' value do when used in grid-template-columns?

• Adds a margin between grid items

• Aligns the grid items to the center

• Automatically adjusts the column width to fill the container

• Sets the column width to a fixed size

How can you repeat a column width multiple times in a grid layout?

• By setting 'grid-auto-columns'

• Using the 'repeat' function

• By applying 'grid-template-rows'

• Using 'grid-gap'

What unit is commonly used in grid layouts to represent a fraction of the available space?

• px

• rem

• em

• fr

Which property is used to add space between grid items without using margins?

• grid-auto-flow

• grid-gap

• grid-template-rows

• grid-template-areas

How can you create a simple layout with a main area and a sidebar using CSS Grid?

• By using 'display: flex' and setting flex-direction

• By setting 'grid-template-areas'

• By defining grid-template-columns with different 'fr' values

• By applying 'grid-auto-flow: dense'