Update file menu.html

wiki/menu.html

@@ -5,85 +5,86 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Updated Navigation Bar with Centered Items and New Links</title>
     <style>
-        body {
-            margin: 0;
-            font-family: 'Times New Roman', serif;
-        }
-  
-        .my-nav {
-            background-color: #ffe4e1;
-            padding: 5px 0;
-            position: fixed;
-            width: 100%;
-            top: 0;
-            left: 0;
-            z-index: 1000;
-            height: 50px;
-            border-radius: 20px;
-            display: flex;
-            justify-content: center;
-        }
-        .logo-container {
-            position: absolute;
-            top: 10px;
-            left: 10px;
-            z-index: 1030;
-        }
-        .navbar-logo {
-            height: 200px;
-            border-radius: 30px;
-        }
-        .my-navbar {
-            list-style-type: none;
-            padding: 0;
-            margin: 0;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            height: 100%;
-        }
-        .my-navbar > li {
-            position: relative;
-            margin: 0 10px;
-        }
-        .my-navbar > li > a {
-            color: black;
-            text-decoration: none;
-            padding: 5px 10px;
-            display: block;
-            border-radius: 15px;
-            transition: background-color 0.3s, color 0.3s;
-        }
-        .my-navbar > li > a:hover,
-        .my-navbar > li > a.active {
-            background-color: #fa8072;
-            color: white;
-        }
-        .son {
-            display: none;
-            position: absolute;
-            background-color: #ffe4e1;
-            min-width: 160px;
-            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
-            z-index: 1;
-            opacity: 0;
-            transition: opacity 0.3s;
-            top: 100%;
-            border-radius: 20px; 
-        }
-        .son li a {
-            color: #2B5D6F;
-            padding: 12px 16px;
-            text-decoration: none;
-            display: block;
-            border-radius: 20px; 
-        }
+      body {
+          margin: 0;
+          font-family: 'Times New Roman', serif;
+      }
 
-        .son li a:hover {
-            background-color: #f1f1f1;
-            border-radius: 20px; 
-        }
-    </style>
+      .my-nav {
+          background-color: #ffe4e1;
+          padding: 5px 0;
+          position: fixed;
+          width: 100%;
+          top: 0;
+          left: 0;
+          z-index: 1000;
+          height: 50px;
+          border-radius: 20px;
+          display: flex;
+          justify-content: center;
+      }
+      .logo-container {
+          position: absolute;
+          top: 10px;
+          left: 10px;
+          z-index: 1030;
+      }
+      .navbar-logo {
+          height: 200px;
+          border-radius: 30px;
+      }
+      .my-navbar {
+          list-style-type: none;
+          padding: 0;
+          margin: 0;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          height: 100%;
+      }
+      .my-navbar > li {
+          position: relative;
+          margin: 0 10px;
+      }
+      .my-navbar > li > a {
+          color: black;
+          text-decoration: none;
+          padding: 5px 10px;
+          display: block;
+          border-radius: 15px;
+          transition: background-color 0.3s, color 0.3s;
+      }
+      .my-navbar > li > a:hover,
+      .my-navbar > li > a.active {
+          background-color: #fa8072;
+          color: white;
+      }
+      .son {
+          display: none;
+          position: absolute;
+          background-color: #ffe4e1;
+          min-width: 180px; /* 增加寬度 */
+          box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+          z-index: 1;
+          opacity: 0;
+          transition: opacity 0.3s;
+          top: 100%;
+          border-radius: 20px; 
+      }
+      .son li a {
+          color: #2B5D6F;
+          padding: 12px 16px;
+          text-decoration: none;
+          display: block;
+          border-radius: 20px; 
+          white-space: nowrap; /* 防止文本換行 */
+      }
+
+      .son li a:hover {
+          background-color: #f1f1f1;
+          border-radius: 20px; 
+      }
+  </style>
 </head>
 <body>
     <nav class="my-nav" id="navbox">