diff --git a/discussion-9/index.html b/discussion-9/index.html
new file mode 100644
index 0000000..5e4594a
--- /dev/null
+++ b/discussion-9/index.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Navigation and Dropdown</title>
+    <link rel="stylesheet" href="../previewer/previwer-style.css" />
+  </head>
+  <body>
+    <div class="topic" topic-name="attribute selector">
+      <style>
+        a[target] {
+          background-color: #e20a0a;
+        }
+        a[target="_PARENT"] {
+          background-color: #09db13;
+        }
+        a[class="abc"] {
+          background-color: #bcdb09;
+        }
+        a[sazzad] {
+          background-color: aqua;
+        }
+        div[bangla|="Bangla"] {
+          color: #e20a0a;
+        }
+        div[bangla^="aB"] {
+          color: #e20a0a;
+        }
+      </style>
+      <a href="#" target="_blank">click</a>
+      <a href="#">Button</a>
+      <a href="#">Button</a>
+      <a href="#">Button</a>
+      <a href="#">Button</a>
+
+      <a href="#" target="_Parent">click</a>
+      <a href="#" target="_blank" class="abc">click</a>
+      <a href="#" sazzad="_blank">click</a>
+
+      <div bangla="amar sonar bangla">amar sonar bangla</div>
+      <div bangla="aBangla-desh-i-love kkk">i love Bangla-desh</div>
+      <div bangla="ab">i love Bangla-desh</div>
+      <div></div>
+    </div>
+
+    <script src="../previewer/previwer-script.js"></script>
+  </body>
+</html>
diff --git a/index.html b/index.html
index 278651d..535f46b 100644
--- a/index.html
+++ b/index.html
@@ -6,14 +6,7 @@
     <title>css-riddle</title>
   </head>
   <body>
-    <div
-      style="
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        height: 90vh;
-      "
-    >
+    <div style="display: flex; align-items: center; justify-content: center; height: 90vh">
       <ul style="padding-left: 0">
         <li style="list-style-type: none; margin-left: -20px">
           <h3 style="text-align: center">Select Discussion</h3>
@@ -34,8 +27,11 @@ <h3 style="text-align: center">Select Discussion</h3>
           <a target="_blank" href="./discussion-7/index.html">Discussion 7</a>
         </li>
         <li>
-            <a target="_blank" href="./discussion-8/index.html">Discussion 8</a>
-          </li>
+          <a target="_blank" href="./discussion-8/index.html">Discussion 8</a>
+        </li>
+        <li>
+          <a target="_blank" href="./discussion-9/index.html">Discussion 9</a>
+        </li>
       </ul>
     </div>
   </body>
