Title: Submenu Dropdown CSS Issue WordPress Flozo Theme
Last modified: August 22, 2016

---

# Submenu Dropdown CSS Issue WordPress Flozo Theme

 *  Resolved [Plug In Solar](https://wordpress.org/support/users/plug-in-solar/)
 * (@plug-in-solar)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/submenu-dropdown-css-issue-wordpress-flozo-theme/)
 * Hi,
 * I have an issue with my site, where I can’t get the Submenu’s to display properly.
   I have a main menu, and on the LED lighting entry there is a Submenu, which should
   have two items, however on hover, one of the items disappears. The Submenu is
   also not displaying correctly underneath one another, but side by side, even 
   though I have list-item specified in the CSS.
 * The website is: [http://www.pluginsolar.co.uk](http://www.pluginsolar.co.uk)
 * The CSS for the main menu and submenu can be seen below.
 *     ```
       ul#menu-main {
           display: block;
           margin: 8px 0px 0px;
           clear: both;
           padding: 0px 0px 0px 4px;
           background: none repeat scroll 0% 0% #EE4952;
           list-style: outside none none;
           height: 60px;
           font-family: BebasNeueRegular,Helvetica,Arial,sans-serif;
           font-size: 16px;
       }
       	ul#menu-main li.current-menu-item a{
       		color: #333333;
       	}
   
       	 ul#menu-main li{
       		float: left;
       		line-height: 60px;
       		z-index: 40;
       	}
       		 ul#menu-main li a{
           padding-bottom: 21px;
           padding-top: 20px;
           padding-left: 20px;
           padding-right: 20px;
       			color: #fff;
       			text-decoration: none;
       		}
       			ul#menu-main li a:hover{
       				color: #333333;
       			}
       			ul#menu-main li a:hover.sub-menu li,
       			ul#menu-main li a:hover ~.sub-menu li{
         			clear: both;
       			display: list-item;
       			}
   
       ul.sub-menu {
       /* text-align: left; */
       clear:both;
       display: list-item;
       margin: 0;
       padding: 0px;
       list-style: none;
       -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
       -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
       box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
       }
       ul.sub-menu li {
       /* font: bold 13px/18px sans-serif; */
       /* border-bottom: solid 1px #FFF; */
       /* border-top: solid 1px #FFF; */
       clear: both;
       margin-right: -4px;
       position: absolute;
       padding: 0px;
       background: none repeat scroll 0% 0% #f6871f;
       cursor: pointer;
       transition: all 0.2s ease 0s;
       display: none;
       }
       ul.sub-menu li:hover {
         clear: both;
         background: #000;
         display:list-item;
         color: #fff;
         margin-right: -4px;
       position: absolute;
       padding: 0px;
       background: none repeat scroll 0% 0% #f6871f;
       cursor: pointer;
       transition: all 0.2s ease 0s;
       float:left;
       }
       ul.sub-menu li ul {
         clear: both;
         padding: 0;
         position: absolute;
         border: none;
         top: 48px;
         left: 0;
         width: 150px;
         -webkit-box-shadow: none;
         -moz-box-shadow: none;
         box-shadow: none;
         display:list-item;
         opacity: 0;
         -webkit-transiton: opacity 0.2s;
         -moz-transition: opacity 0.2s;
         -ms-transition: opacity 0.2s;
         -o-transition: opacity 0.2s;
         -transition: opacity 0.2s;
       }
       ul.sub-menu li ul li {
         clear: both;
         background: #555;
         display: block;
         border: none;
         color: #fff;
         text-shadow: 0 -1px 0 #000;
       }
       ul.sub-menu li ul li:hover {
       clear: both;
       background: #666;
         display:list-item;
         color: #fff;
         margin-right: -4px;
       position: absolute;
       padding: 0px;
       background: none repeat scroll 0% 0% #f6871f;
       cursor: pointer;
       transition: all 0.2s ease 0s;
       }
       ul.sub-menu li:hover ul {
         clear: both;
         display: list-item;
         opacity: 1;
         visibility: visible;
       }
       ```
   
 * Any help with this issue would be much appreciated. Thank You.

Viewing 1 replies (of 1 total)

 *  Thread Starter [Plug In Solar](https://wordpress.org/support/users/plug-in-solar/)
 * (@plug-in-solar)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/submenu-dropdown-css-issue-wordpress-flozo-theme/#post-5782215)
 * resolved

Viewing 1 replies (of 1 total)

The topic ‘Submenu Dropdown CSS Issue WordPress Flozo Theme’ is closed to new replies.

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [display](https://wordpress.org/support/topic-tag/display/)
 * [flozo](https://wordpress.org/support/topic-tag/flozo/)
 * [menu](https://wordpress.org/support/topic-tag/menu/)
 * [submenus](https://wordpress.org/support/topic-tag/submenus/)

 * 1 reply
 * 1 participant
 * Last reply from: [Plug In Solar](https://wordpress.org/support/users/plug-in-solar/)
 * Last activity: [11 years, 3 months ago](https://wordpress.org/support/topic/submenu-dropdown-css-issue-wordpress-flozo-theme/#post-5782215)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics
