Title: Issue with drop down menu
Last modified: August 20, 2016

---

# Issue with drop down menu

 *  [nomiree](https://wordpress.org/support/users/nomiree/)
 * (@nomiree)
 * [14 years, 3 months ago](https://wordpress.org/support/topic/issue-with-drop-down-menu/)
 * Ok, I’m using wordpress theme SLR Lounge V2, and am trying to modify it to suit
   my needs. The problem I’m having is with my navigation’s drop down menu. I’m 
   currently using a custom menu (wordpress functionality, not theme).
 * Initially, there was no background behind the drop down at all (so you couldn’t
   really read it), which I’ve managed to modify to get the colour I want, however,
   I don’t want the gaps, and I want it all to line up flush on the right hand side.
   Here’s a screenshot of what I’m talking about:
 * > [View post on imgur.com](https://imgur.com/uSn1i)
 * I’ve played with padding etc to no avail. Also, sometimes the navigation elements
   end up paired beside each other instead of a straight vertical list if I play
   with the padding.
 * Here is the css I have relating to the drop down navigation:
 *     ```
       /* Start Menu Items */
   
       #menu {
       list-style:none;
       margin:0;
       padding:0;
       width:1000px;
       height:100%;
       border:none;
       }
   
       #menu:after {
       content:'';
       display:block;
       clear:both;
       } 
   
       #menu li.hover a,#menu li:hover a,#menu li.hover,#menu li:hover {
       	position: relative;
   
       }
   
       #menu li.hover ul, #menu li:hover ul {
       	display: block;
       }
   
       /*start drop-down menus on the top menu*/
   
       #menu ul {
       	padding:0;
       	margin:0 0 0 -10px;
       	list-style:none;
       	width:108px;
       	display: none; /*******if you delete this, your drop down menu will appear randomly on the page somewhere **/
       	position: absolute;
       }
   
       #menu ul li a { /*This is the drop down stufff */
       	text-align:left;
       	float:right;
       ```
   

Viewing 2 replies - 1 through 2 (of 2 total)

 *  [dulbie17](https://wordpress.org/support/users/dulbie17/)
 * (@dulbie17)
 * [14 years, 3 months ago](https://wordpress.org/support/topic/issue-with-drop-down-menu/#post-2540611)
 * I have spent SO MANY HOURS trying to find the answer to this question as I am
   using the same theme and had the same problem… I JUST finally fixed it, and made
   an account to respond to your message in hopes to save you time and stress!!!
   here’s what I found to work for me, I’ll just paste my coding in for you!
 * (right where your coding you pasted above ends, is where you should be changing
   all the items)
 *     ```
       #menu ul li a { /*This is the drop down stufff */
       	text-align:center;
       	float:right;
       	background-color:#000000;
       	margin:0px 10px -30px -25px;
       	padding:10px 10px 10px 10px;
       	font-size:10px;
       	width:108px;
       ```
   
 * you can change the text alignment in the first line, and the margin and padding
   > play around with those too. but the theme was missing the bottom width section
   which made it a solid box around the drop down menu with no spaces or just highlighted
   words. if you change the “108px” to a different number to make the drop down 
   menu smaller or bigger, just make sure you change the “width: 108px” in the section
   right above that! hope this helps 🙂
 *  Thread Starter [nomiree](https://wordpress.org/support/users/nomiree/)
 * (@nomiree)
 * [14 years, 3 months ago](https://wordpress.org/support/topic/issue-with-drop-down-menu/#post-2540612)
 * Thank you so much! After many hours of playing, I’d come up with a different 
   solution, which involved modifying the parent IDs (#menu etc), but your result
   still looks cleaner. The only issue mine still had was there was slightly more
   padding on the right than the left which couldn’t seemed to be fixed no matter
   what I did.
 * So I ended up switching to your way. Why is something so simple always the answer?
   And you always only work it out once you’ve spent many many hours on it.
 * Although I’ve now switched to your way, here’s the code I came up with just in
   case you’re interested (or if anyone else is having similar issues that the above
   code can’t fix.
 *     ```
       /*start drop-down menus on the top menu*/
   
       #menu ul {
       	padding:0;
       	margin:0 0 0 -10px;
       	list-style:none;
       	width:108px;
       	display: none; /*******if you delete this, your drop down menu will appear randomly on the page somewhere **/
       	position: absolute;
       }
   
       #menu ul li a { /*This is the drop down stufff */
       	text-align:left;
       	float:right;
       	background:#333333;
       	margin:0 10px 0 10px;
       	padding:0 10px 0 0px;
       	font-size:10px;	
   
       }
   
       #menu ul li a:hover {background:#333333;}
   
       /*end drop-down menus on the top menu*/
       ```
   

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Issue with drop down menu’ is closed to new replies.

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [drop-down](https://wordpress.org/support/topic-tag/drop-down/)
 * [navigation](https://wordpress.org/support/topic-tag/navigation/)

 * 2 replies
 * 2 participants
 * Last reply from: [nomiree](https://wordpress.org/support/users/nomiree/)
 * Last activity: [14 years, 3 months ago](https://wordpress.org/support/topic/issue-with-drop-down-menu/#post-2540612)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics