Title: Firefox WordPress Menu Dropdown Issue Last modified: August 21, 2016 --- # Firefox WordPress Menu Dropdown Issue * Resolved [ekdor](https://wordpress.org/support/users/ekdor/) * (@ekdor) * [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/) * For some reason in FirFox on my Mac and PC and Explorer on my PC I always get the drop down menu appear on the edge of the screen as though it were floated. * Ive had this issue for a while and worked on it several times. I can’t work out what the issue is. Does anyone have any solid ideas. I’ve tried a lot of css trial and error, tried different permutations of `wp_nav_menu( array` and Function code. The best I can do when messing with this is to cause all browsers to do it. * I seems to be related to `ul.dropdown ul { position: absolute; }` * I can’t provide you a link to the site shown in the screenshot bellow. But I can give you a link to a different site. This issue is occurring with all my sites. * [Website showing the issue](http://www.parklandsart.com) * [Screenshot of the issue](http://www.burramundi.com/wp-content/uploads/Firefox-Wordpress-Menu-Dropdown-Issue.jpg) Viewing 8 replies - 1 through 8 (of 8 total) * [Andrew Nevins](https://wordpress.org/support/users/anevins/) * (@anevins) * WCLDN 2018 Contributor | Volunteer support * [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/#post-5051992) * Assuming this theme is yours have you actually given the dropdown menu left/top/ bottom/right positioning? * Thread Starter [ekdor](https://wordpress.org/support/users/ekdor/) * (@ekdor) * [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/#post-5052002) * Yes it is mine. Built from scratch. Hmm can you have a look for me? I’ll do a reply with the full CSS I used. I ask because I’ve driven myself crazy going over my menu stylesheets. * Thread Starter [ekdor](https://wordpress.org/support/users/ekdor/) * (@ekdor) * [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/#post-5052004) * ``` .menu-bar { width: 1000px; height: 64px; font-family: Tahoma, Verdana, Segoe, sans-serif; text-align: center; padding-top: 21px; margin-top: -64px; margin-bottom: -21px; overflow: visible; border-radius: 1px; position: relative; z-index: 2; } .menu-bar a { text-transform: capitalize; color: rgba(0,0,0,0.75); font-size: 18px; font-weight: normal; text-shadow: 0px 0px 4px rgba(0,0,0,0.4); } .current-menu-item a {} ul.dropdown { list-style: none; width: 100%; } ul.dropdown li { display: inline; position: relative; } ul.dropdown li:hover a { padding: 12px 15px 11px 15px !important; } ul.dropdown a { padding: 0px 15px 0px 15px; } ul.dropdown a:hover { color: rgba(0,0,0,0.75); background: linear-gradient( #ffffff 0%, rgba(255,255,255,0) 100% ); } ul.dropdown li ul a { display: block; font-size: 14px; margin: 0px 0px 0px 0px !important; } /* I think the issue has something to do with this */ ul.dropdown ul { text-align: left; position: absolute; list-style: none; width: 250px; z-index: 500; margin: 0px 0px 0px 0px !important; } ul.dropdown li ul { background: url('images/menu-dropdown-bot.png') no-repeat bottom, url('images/menu-dropdown-top.jpg') no-repeat top, url('images/menu-dropdown-bkgrnd.png') repeat-y; margin: 8px 0px 0px 0px !important; box-shadow: 0px 2px 6px 1px rgba(0, 0, 0, 0.35); border-radius: 1px; } ul.dropdown ul ul { top: 0px; left: 100%; } ul.dropdown ul li {} ul.dropdown li * a:hover { background: url('images/menu-dropdown-h.png') no-repeat; margin: 0px 0px 0px 0px !important; font-size: 14px; } ul.dropdown ul, ul.dropdown li:hover ul ul, ul.dropdown ul li:hover ul ul { display: none; } ul.dropdown li:hover ul, ul.dropdown ul li:hover ul, ul.dropdown ul li ul li:hover ul { display: block; } ``` * [Andrew Nevins](https://wordpress.org/support/users/anevins/) * (@anevins) * WCLDN 2018 Contributor | Volunteer support * [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/#post-5052007) * Look at using left positioning [https://developer.mozilla.org/en-US/docs/Web/CSS/position](https://developer.mozilla.org/en-US/docs/Web/CSS/position)– Maybe you accidentally skipped a step in a tutorial for styling a menu? * Thread Starter [ekdor](https://wordpress.org/support/users/ekdor/) * (@ekdor) * [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/#post-5052026) * It’s possible. The first one I did was based on a tutorial. All the others followed from what I did. Hence the propagation of the issue through my other sites. * The position absolute used in the `ul.dropdown ul` style causes in most browsers puts it where I want it. But if I change or remove it all the other browsers act like FireFox and IE do. Makes me think FF and IE are not using it. I tried making it important but no change. I might be getting distracted by that tho. NOTE: I have trie trial and error removals to identify the differences. But this is the only thing that seems to visually splits the browsers. * I might spend tonight starting it from scratch using my own understanding. Adding bit by bit keeping an eye on FF. Just hopping not to have to. Lots of other work to do. * [Andrew Nevins](https://wordpress.org/support/users/anevins/) * (@anevins) * WCLDN 2018 Contributor | Volunteer support * [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/#post-5052028) * I don’t understand your reluctance to use the left position: * ``` ul.dropdown ul { left: 0; } ``` * Thread Starter [ekdor](https://wordpress.org/support/users/ekdor/) * (@ekdor) * [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/#post-5052039) * It’s just that I didn’t understand. Sorry. * Thread Starter [ekdor](https://wordpress.org/support/users/ekdor/) * (@ekdor) * [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/#post-5052040) * Great, thank you. That was what I needed. Fixed. Viewing 8 replies - 1 through 8 (of 8 total) The topic ‘Firefox WordPress Menu Dropdown Issue’ is closed to new replies. * 8 replies * 2 participants * Last reply from: [ekdor](https://wordpress.org/support/users/ekdor/) * Last activity: [11 years, 10 months ago](https://wordpress.org/support/topic/firefox-wordpress-menu-dropdown-issue/#post-5052040) * Status: resolved ## Topics ### Topics with no replies ### Non-support topics ### Resolved topics ### Unresolved topics ### All topics