Test of CSS knowledge

Question 1: When the following elements are displayed on the browser, how much is their margin worth?
1. 50px, because 20 + 30 = 50
2. 30px - get bigger margins
3. 20px - margin-top value is preferred.
In CSS, sometimes there will be a special case where the value of the margin attribute overlaps, the value used will be the maximum value between the two margin attributes. This case is called Collapse Margin
Question 2: What attribute will transform element from state A to state B?
1. transform: perspective (200px);
2. transform: skew (45deg, 45deg);
3. transform: scale (0.5);
Question 3: Which Selector targets the element
final?
1. ul li: last-child
2. ul: last-child li
3. ul: last-child (li)
Question 4: What is the final background color of this div?
1. Red - because the id has a higher priority than the rest
2. Blue - because the .blue class format follows the #red id format .
3. Purple - mix of red and blue
See more: CSS Specificity
Question 5: What is the font size of h1 element in pixels?
1. 1.5px
2. 25px
3. 30px
1em is equivalent to the size of the current font-size, similarly we have 1.5em = 1.5 times the font = 1.5 * 20px = 30px
Question 6: What is wrong in the pseudo-element: after in the CSS section below?
1. Missing content attribute adds content to the back of the selected element.
2. Pseudo-element does not work on the heading
3. The left value has no value for the unit as a percentage.
Question 7: Where is not an attribute in CSS?
1. object-fit
2. pointer-events
3. font-smoothing
4. text-opacity
Question 8: To select the last element in the list below, how do we use the selector nth-child ()?
1. ul li: nth-child (last)
2. ul li: nth-child (2)
3. ul li: nth-child (3)
Question 9: Which containers are centered (both vertical and horizontal) inside elements?
1. A
2. B
3. C
Question 10: Which of the following answers contains invalid CSS?
1. margin: 10px 8px 5px;
2. margin: -20px;
3. margin: auto;
4. All answers are valid.

Test of CSS knowledge - Part 8

You should read it