From 838b322d720dffc54c79455f60ce99a921f91709 Mon Sep 17 00:00:00 2001
From: Ariz Faiyaz <arizfaiyazwork@gmail.com>
Date: Tue, 14 Oct 2025 04:57:43 +0530
Subject: [PATCH] feat(curriculum): add interactive examples to block and
 inline lesson (#62767)

---
 .../lecture-what-is-css/672acc1e24c1e54df5ad89bd.md    | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/curriculum/challenges/english/blocks/lecture-what-is-css/672acc1e24c1e54df5ad89bd.md b/curriculum/challenges/english/blocks/lecture-what-is-css/672acc1e24c1e54df5ad89bd.md
index e41a876b6f3..9089bb1f1b7 100644
--- a/curriculum/challenges/english/blocks/lecture-what-is-css/672acc1e24c1e54df5ad89bd.md
+++ b/curriculum/challenges/english/blocks/lecture-what-is-css/672acc1e24c1e54df5ad89bd.md
@@ -5,7 +5,7 @@ challengeType: 19
 dashedName: what-is-the-difference-between-inline-and-block-level-elements-in-css
 ---
 
-# --description--
+# --interactive--
 
 In HTML and CSS, elements are classified as either **inline elements** or **block-level elements**, and this classification dictates how they behave in the document layout.
 
@@ -21,6 +21,8 @@ Some common block-level elements are `div` elements, paragraphs, headings, order
 
 Here is a code example of a block-level element:
 
+:::interactive_editor
+
 ```html
 <p style="border: 2px solid red;">
   First paragraph
@@ -28,6 +30,8 @@ Here is a code example of a block-level element:
 <p>Second paragraph</p>
 ```
 
+:::
+
 In this example, we have two paragraph elements where the first one has a red border around it.
 
 The two paragraph elements do not share the same line because they are block level elements by default.
@@ -44,6 +48,8 @@ Common inline elements are `span`, `anchor`, and `img` elements.
 
 Here's an example to better understand inline elements:
 
+:::interactive_editor
+
 ```html
 <p>This is a
   <span style="color: red; border: 2px solid green;">red</span>
@@ -51,6 +57,8 @@ Here's an example to better understand inline elements:
 </p>
 ```
 
+:::
+
 In this example, we have a `span` element nested inside of a paragraph element. The `span` element has a `red` text color with a `green` border around it so you can see the highlighted word better.
 
 As you can see, the `span` element only takes up as much space as the word "red" and does not push the following content to a new line.