From ab4ab8d6e313c25e797569c9f6770f348c6c3b11 Mon Sep 17 00:00:00 2001
From: OnkarRuikar <87750369+OnkarRuikar@users.noreply.github.com>
Date: Wed, 10 Jan 2024 13:13:24 +0530
Subject: [PATCH 1/4] fix(css): update 'display' interactive demo

---
 live-examples/css-examples/basic-box-model/display.css  | 6 +++++-
 live-examples/css-examples/basic-box-model/display.html | 8 +++++---
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/live-examples/css-examples/basic-box-model/display.css b/live-examples/css-examples/basic-box-model/display.css
index cd59a3eaa..0df83416b 100644
--- a/live-examples/css-examples/basic-box-model/display.css
+++ b/live-examples/css-examples/basic-box-model/display.css
@@ -3,8 +3,12 @@
   height: 100%;
 }
 
+code {
+  background: #8888;
+}
+
 #example-element {
-  border: 3px solid #00f;
+  border: 3px solid orange;
 }
 
 .child {
diff --git a/live-examples/css-examples/basic-box-model/display.html b/live-examples/css-examples/basic-box-model/display.html
index 2a789114f..5f01a18aa 100644
--- a/live-examples/css-examples/basic-box-model/display.html
+++ b/live-examples/css-examples/basic-box-model/display.html
@@ -38,11 +38,13 @@
 <div id="output" class="output large hidden">
   <section id="default-example" class="default-example">
     <div class="example-container">
+      Change <code>display</code> property of this
       <div id="example-element">
-        <div class="child">One</div>
-        <div class="child">Two</div>
-        <div class="child">Three</div>
+        <div class="child">Child 1</div>
+        <div class="child">Child 2</div>
+        <div class="child">Child 3</div>
       </div>
+      <code>div</code> element.
     </div>
   </section>
 </div>

From 7061cb56dad1516ff41992c6b36493328a99ee41 Mon Sep 17 00:00:00 2001
From: Onkar Ruikar <87750369+OnkarRuikar@users.noreply.github.com>
Date: Fri, 12 Jan 2024 11:14:17 +0530
Subject: [PATCH 2/4] Apply suggestions from code review

---
 live-examples/css-examples/basic-box-model/display.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/live-examples/css-examples/basic-box-model/display.html b/live-examples/css-examples/basic-box-model/display.html
index 5f01a18aa..df6ff506c 100644
--- a/live-examples/css-examples/basic-box-model/display.html
+++ b/live-examples/css-examples/basic-box-model/display.html
@@ -38,13 +38,13 @@
 <div id="output" class="output large hidden">
   <section id="default-example" class="default-example">
     <div class="example-container">
-      Change <code>display</code> property of this
+      Some text A.
       <div id="example-element">
         <div class="child">Child 1</div>
         <div class="child">Child 2</div>
         <div class="child">Child 3</div>
       </div>
-      <code>div</code> element.
+      Some text B.
     </div>
   </section>
 </div>

From b02b5d0f4ccdbd16b0b8fb3e3c93bde1adb81567 Mon Sep 17 00:00:00 2001
From: Onkar Ruikar <87750369+OnkarRuikar@users.noreply.github.com>
Date: Fri, 12 Jan 2024 11:42:58 +0530
Subject: [PATCH 3/4] Update
 live-examples/css-examples/basic-box-model/display.css

Co-authored-by: Estelle Weyl <estelle@openwebdocs.org>
---
 live-examples/css-examples/basic-box-model/display.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/live-examples/css-examples/basic-box-model/display.css b/live-examples/css-examples/basic-box-model/display.css
index 0df83416b..d4c4cc2f4 100644
--- a/live-examples/css-examples/basic-box-model/display.css
+++ b/live-examples/css-examples/basic-box-model/display.css
@@ -8,7 +8,7 @@ code {
 }
 
 #example-element {
-  border: 3px solid orange;
+  border: 3px dashed orange;
 }
 
 .child {

From bef7553c9c4915f23046f3ee6a8c08e4db00e90a Mon Sep 17 00:00:00 2001
From: OnkarRuikar <87750369+OnkarRuikar@users.noreply.github.com>
Date: Tue, 16 Jan 2024 11:56:12 +0530
Subject: [PATCH 4/4] add short description in the output

---
 live-examples/css-examples/basic-box-model/display.html | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/live-examples/css-examples/basic-box-model/display.html b/live-examples/css-examples/basic-box-model/display.html
index df6ff506c..99c9ac712 100644
--- a/live-examples/css-examples/basic-box-model/display.html
+++ b/live-examples/css-examples/basic-box-model/display.html
@@ -36,6 +36,10 @@
 </section>
 
 <div id="output" class="output large hidden">
+  <p>
+    Apply different <code>display</code> values on the dashed orange-bordered <code>div</code>, which contains three
+    child elements.
+  </p>
   <section id="default-example" class="default-example">
     <div class="example-container">
       Some text A.