What CSS properties make up the box model?
Margin, Padding, and border
Which CSS property pushes boxes away from each other?
Margin
Which CSS property add space between a box’s content and its border?
Padding
What is a pseudo-class?
It is a keyword added to a selector that specifies a special state of the selected element(s)
What are CSS pseudo-classes useful for?
Add functionality
Name two types of units that can be used to adjust font-size in CSS
Px, Ems
What CSS property controls the font used for the text inside an element?
font-family property
What is the default flex-direction of a flex container?
Row
What is the default flex-wrap of a flex container?
Nowrap
Why do two div elements “vertically stack” on one another by default?
Because its a block element
What is the default flex-direction of an element with display: flex?
Row
What are the three primary components of a page layout? (Which helper classes do you need?)
Container, row, and column
What is the minimum number of columns that you should put in a row
1
What is the purpose of a container?
To “contain” the entire layout and give the whole layout a minimum width. Make the layout organized.
What is the default value for the position property of HTML elements?
position: static;
How does setting position: relative on an element affect document flow?
It would not affect
How does setting position: relative on an element affect where it appears on the page?
THere is no inherit change
How does setting position: absolute on an element affect document flow?
Remove from the document flow.
How does setting position: absolute on an element affect where it appears on the page?
It depends on the non-statically positioned parent it will position itself against and any box offset properties
How do you constrain an absolutely positioned element to a containing block?
Use the position: relative property in the containing block
What are the four box offset properties?
Top, bottom, left, right
The transition property is shorthand for which four CSS properties?
transition-delay: 250ms;
transition-duration: 2s;
transition-property: all, height, color;
transition-timing-function: linear;
What is a breakpoint in responsive Web design?
The point in which the CSS updates for us. Ex: if the screen gets to 500px, the element changes its width
What is the advantage of using a percentage (e.g. 50%) width instead of a fixed (e.g. px) width for a “column” class in a responsive layout?
It allows them to grow and contract with the web page as it moves between the break points.
