navigation

Test of CSS knowledge - Part 8

  1. 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
  2. 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);
  3. Question 3: Which Selector targets the element
  4. final?
    1. ul li: last-child
    2. ul: last-child li
    3. ul: last-child (li)
  5. 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
  6. 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
  7. 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.
  8. Question 7: Where is not an attribute in CSS?
    1. object-fit
    2. pointer-events
    3. font-smoothing
    4. text-opacity
  9. 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)
  10. Question 9: Which containers are centered (both vertical and horizontal) inside elements?
    1. A
    2. B
    3. C
  11. 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.
Update 24 May 2019