HTML & CSS Word Scramble: Advanced CSS & Layout (Modules 43–52)
Name:
Date:
Class:
🔤
Word scramble
Unscramble the letters and write each key term on the line.
1
OTLN-AFMFIY
A CSS property that sets the typeface for text, accepting a prioritised list of font names with a generic fallback such as serif or sans-serif
2
MRE
A CSS relative unit. 1rem equals the root element's (html) font size. Unlike em, ______ is not affected by nesting — it is consistent throughout the page.
3
XOB LDOEM
Every HTML element is a box with four layers: content, padding, border, and margin. These layers control the element's size and spacing.
4
GIAPDDN
A CSS property that adds space inside an element's border, between the content area and the border. Unlike margin, ______ is inside the element.
5
DEORBR
A CSS shorthand property that sets a visible line around an element by specifying width, style, and color in one declaration, e.g. ______: 2px solid black
6
RIMGAN
A CSS property that adds space outside an element's border, between it and surrounding elements. Unlike padding, ______ is outside the element's background.
7
TAH-IWXDM
A CSS property that sets the maximum width an element is allowed to reach. The element can be smaller but never wider. Useful for responsive layouts.
8
ZII-OGBXSN
Controls whether width and height include padding and border. border-box includes them; content-box (the default) measures content only.
9
PSLYIAD
A CSS property that controls how an element participates in layout. Common values: block, inline, inline-block, none and flex.
10
OTIISNPO
A CSS property that sets how an element is positioned. Values: static (default), relative, absolute, fixed or sticky. Offset properties (top, right, bottom, left) take effect on non-static elements.
Answer Key
HTML & CSS · Modules 43–52
1OTLN-AFMFIY → font-family — A CSS property that sets the typeface for text, accepting a prioritised list of font names with a generic fallback such as serif or sans-serif
2MRE → rem — A CSS relative unit. 1rem equals the root element's (html) font size. Unlike em, rem is not affected by nesting — it is consistent throughout the page.
3XOB LDOEM → box model — Every HTML element is a box with four layers: content, padding, border, and margin. These layers control the element's size and spacing.
4GIAPDDN → padding — A CSS property that adds space inside an element's border, between the content area and the border. Unlike margin, padding is inside the element.
5DEORBR → border — A CSS shorthand property that sets a visible line around an element by specifying width, style, and color in one declaration, e.g. border: 2px solid black
6RIMGAN → margin — A CSS property that adds space outside an element's border, between it and surrounding elements. Unlike padding, margin is outside the element's background.
7TAH-IWXDM → max-width — A CSS property that sets the maximum width an element is allowed to reach. The element can be smaller but never wider. Useful for responsive layouts.
8ZII-OGBXSN → box-sizing — Controls whether width and height include padding and border. border-box includes them; content-box (the default) measures content only.
9PSLYIAD → display — A CSS property that controls how an element participates in layout. Common values: block, inline, inline-block, none and flex.
10OTIISNPO → position — A CSS property that sets how an element is positioned. Values: static (default), relative, absolute, fixed or sticky. Offset properties (top, right, bottom, left) take effect on non-static elements.