Soohyun Posted November 2 Posted November 2 (edited) Site URL: https://soohyun-kim.squarespace.com/config/pages/website-tools Does anyone know how to edit the dropdown menu? My version is 7.1 In my dropdown menu, I would like to change the width to as same as my works width. And When I hover the menu, each item should change the text not the box. I appreciate your help. Thank you. Edited November 2 by Soohyun
Solution Spark-Plugin Posted November 4 Solution Posted November 4 Hi @Soohyun, give this code a try and let me know how it goes: Navigate to Pages > Website Tools > Custom CSS. Paste the code into the CSS editor. Hit Save and you’re done /* Changes the text color of dropdown menu items on hover */ .header-nav .header-nav-item--folder .header-nav-folder-content .header-nav-folder-item:hover a { color: #fff !important; /* Change the color value (#fff) to any desired color code */ /* Instructions: - The color property specifies the text color of the dropdown menu items when hovered over. - You can change `#fff` to any valid color code (e.g., #000000 for black, #d4af37 for gold, etc.). */ } /* Makes the dropdown menu automatically adjust its width */ .header-nav-folder-content { width: auto !important; /* The dropdown will automatically adjust to the content width */ min-width: unset !important; /* Removes any minimum width restriction */ /* Instructions: - The width property is set to `auto` so the dropdown width matches the content size. - `min-width: unset` ensures there is no minimum width constraint, but you can change it to a specific value if needed. */ } - Answered by Iuno from sparkplugin.com
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment