CSS Positioning Quiz: Static and Relative Quiz for Grade 7

📚 Quick Study Guide

🌍 CSS positioning controls how elements are placed on a webpage. 📏 The position property can have values like static, relative, absolute, fixed, and sticky. 🧱 static is the default value. Elements are positioned in the normal flow of the document. 📍 relative positioning positions an element relative to its normal position. You can use top, right, bottom, and left to adjust its final location. ➕ Using top, right, bottom, and left on a static element has no effect.

🧪 Practice Quiz

1. Which of the following is the default value for the CSS position property?
   1. relative
   2. absolute
   3. static
   4. fixed
2. What does position: relative do to an element?
   1. Positions the element relative to the viewport.
   2. Positions the element relative to its containing block.
   3. Positions the element relative to its normal position.
   4. Removes the element from the normal flow of the document.
3. Which CSS property is used to move a relatively positioned element from the top?
   1. margin-top
   2. padding-top
   3. top
   4. position-top
4. If you set position: static and then try to use top: 20px, what happens?
   1. The element moves 20px from the top.
   2. The element moves 20px from the bottom.
   3. The top property is ignored.
   4. The element's position becomes relative.
5. Which property is NOT used to adjust the position of a relatively positioned element?
   1. width
   2. top
   3. right
   4. bottom
6. What is the initial (default) position of an HTML element, if no positioning is specified in CSS?
   1. relative
   2. absolute
   3. static
   4. fixed
7. What happens to the space an element originally occupied when it is relatively positioned?
   1. The space collapses.
   2. The space remains empty.
   3. The space is filled by the next element.
   4. The space is still reserved for the element.