You are developing a Web site in HTML5. You want the new HTML5 structural elements (such as <header> or <article>) to be styled consistently in all browsers. You must add a CSS rule that will change…

Question

Options

• AInline
• BScript
• CFixed
• DBlock

• A
  15% (10)
• B
  3% (2)
• C
  8% (5)
• D
  74% (49)

Explanation

Block (D) is correct because older browsers - particularly Internet Explorer 8 and earlier - don't recognize HTML5 semantic elements like <header>, <footer>, <article>, and <section>, and default to treating them as inline elements. Adding display: block; to these elements in CSS forces all browsers to render them as block-level containers, which is the expected layout behavior for structural elements.

• A (Inline) is wrong because semantic structural elements are meant to act as block containers that stack vertically and fill width - making them inline would break standard page layout.
• B (Script) is not a valid CSS display value at all; it has no meaning in this context.
• C (Fixed) is a CSS position value, not a display value, and applies to element positioning rather than rendering type.

Memory tip: Think "block = building block" - structural HTML5 elements are the building blocks of a page, so they must be displayed as block to behave like the structural containers they represent. The classic fix is:

header, footer, article, section, nav, aside, main {
  display: block;
}

No community discussion yet for this question.