HTML & CSS Interview Question #63

What is inheritance in CSS?

CSS Fundamentals, Selectors, Cascade, Specificity, Box Model, Units & Typography Mid-Level Intermediate

Quick Interview Answer

Inheritance allows some CSS property values to pass from a parent element to its descendants. Text-related properties such as color and font-family commonly inherit, while layout properties such as margin, padding, border, and width generally do not.

Detailed Explanation

Inheritance allows some CSS property values to pass from a parent element to its descendants. Text-related properties such as color and font-family commonly inherit, while layout properties such as margin, padding, border, and width generally do not.

The inherit keyword explicitly requests the parent's computed value. Understanding inheritance reduces duplicate rules and helps developers place typography and theme styles at appropriate container levels.

Code Example

body {
    font-family: Arial, sans-serif;
    color: #1f2937;
}

/* Descendant text normally inherits these values. */

button {
    font: inherit;
}