diff --git a/curriculum/challenges/english/blocks/lecture-css-specificity-the-cascade-algorithm-and-inheritance/672b8f382370e025aadd3f4e.md b/curriculum/challenges/english/blocks/lecture-css-specificity-the-cascade-algorithm-and-inheritance/672b8f382370e025aadd3f4e.md
index 8ab9c0400ca..6cc26bb2b8d 100644
--- a/curriculum/challenges/english/blocks/lecture-css-specificity-the-cascade-algorithm-and-inheritance/672b8f382370e025aadd3f4e.md
+++ b/curriculum/challenges/english/blocks/lecture-css-specificity-the-cascade-algorithm-and-inheritance/672b8f382370e025aadd3f4e.md
@@ -5,7 +5,7 @@ challengeType: 19
dashedName: how-does-inheritance-work-with-css-at-a-high-level
---
-# --description--
+# --interactive--
Inheritance is a key concept in CSS that determines how styles are passed down from parent elements to their child elements.
@@ -17,6 +17,8 @@ In CSS, not all properties are inherited by default. For example, properties lik
For instance, consider the following example where a parent `div` element has its color set using an inline style, and the child `p` element inherits that color:
+:::interactive_editor
+
```html
This is the parent element.
@@ -24,6 +26,8 @@ For instance, consider the following example where a parent `div` element has it
```
+:::
+
In this case, both the parent `div` and the child `p` will display their text in blue because the color is inherited.
On the other hand, properties like `margin`, `padding`, `border`, and `background` are not inherited by default. If you want a child element to inherit these styles, you need to explicitly set them, either directly on the child element or by using the `inherit` keyword.
@@ -32,6 +36,8 @@ The `inherit` keyword can be used to force inheritance of a property from a pare
For example, if you want a specific child element to have the same `padding` as its parent, you can set `padding: inherit` on the child element:
+:::interactive_editor
+
```html
This is the parent element with padding.
@@ -39,6 +45,8 @@ For example, if you want a specific child element to have the same `padding` as
```
+:::
+
In this case, the child `p` element will inherit the `20px` of padding from its parent `div` element.
Inheritance is especially useful for maintaining consistency and reducing redundancy in your stylesheets.