move citation out of blockquote per spec (#2806)

Co-authored-by: Joshua Chen <sidachen2003@gmail.com>
mdn · Jul 17, 2024 · ba0fb4b · ba0fb4b
1 parent 0dc424e
commit ba0fb4b
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 10 deletions.
diff --git a/live-examples/html-examples/text-content/blockquote.html b/live-examples/html-examples/text-content/blockquote.html
@@ -1,4 +1,6 @@
-<blockquote cite="https://www.huxley.net/bnw/four.html">
-  <p>Words can be like X-rays, if you use them properly—they’ll go through anything. You read and you’re pierced.</p>
-  <footer>—Aldous Huxley, <cite>Brave New World</cite></footer>
-</blockquote>
+<div>
+  <blockquote cite="https://www.huxley.net/bnw/four.html">
+    <p>Words can be like X-rays, if you use them properly—they’ll go through anything. You read and you’re pierced.</p>
+  </blockquote>
+  <p>—Aldous Huxley, <cite>Brave New World</cite></p>
+</div>
diff --git a/live-examples/html-examples/text-content/css/blockquote.css b/live-examples/html-examples/text-content/css/blockquote.css
@@ -1,10 +1,7 @@
-blockquote {
-  margin: 0;
-}
-
-blockquote p {
+div:has(> blockquote) {
+  background-color: #ededed;
+  margin: 10px auto;
   padding: 15px;
-  background: #eee;
   border-radius: 5px;
 }
 
@@ -15,3 +12,7 @@ blockquote p::before {
 blockquote p::after {
   content: '\201D';
 }
+
+blockquote + p {
+  text-align: right;
+}