Title: Submenu items lining up incorrectly
Last modified: August 20, 2016

---

# Submenu items lining up incorrectly

 *  Resolved [kylemcburnie](https://wordpress.org/support/users/kylemcburnie/)
 * (@kylemcburnie)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/)
 * Hey community!
    Recently started using wordpress, and I’m trying to set up my
   front page so that my logo is centered above my main menu bar – which I’m trying
   to get to span across the whole page.
 * I managed to get my menu bar to span across the page with some research, mainly
   using padding. After that the submenu items wouldn’t stack vertically (spanned
   across the distance horizontally) so I put in a width parameter in the submenu
   and now they stack vertically again + line up with the parent menu, however they
   leave a blank white box beside them!
 * Obviously the white box is a little distracting, I would love to get rid of it!
 * I would greatly appreciate any help!
 * (www.sdexpeditions.com)

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

 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299035)
 * Hmm, there are some weird CSS styles going on here. Let’s start by cleaning those
   up.
    Remove:
 *     ```
       float: left;
       position: relative;
       ```
   
 * On `.nav_main li li`
    (added extra `li` to match only submenu list items).
 * Then remove:
 *     ```
       width: 37%;
       margin: 0px;
       padding-left: 88px;
       ```
   
 * On `.nav_main li ul`
 *  Thread Starter [kylemcburnie](https://wordpress.org/support/users/kylemcburnie/)
 * (@kylemcburnie)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299037)
 * Alright Andrew I removed those (when you said you added extra li to match only
   submenu items does that mean just remove those two lines from .nav_main li { ….}?
 * So now the menu is still centered however the submenu appears oddly on the page–
   somewhere down below and to the left side.
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299038)
 * Okay, let’s proceed.
    Modify the `top` and `left` values to this;
 *     ```
       top: 0;
       left: 0;
       ```
   
 * On `.nav_main li ul`
    – Add;
 *     ```
       position: relative;
       ```
   
 * On `.nav_main`
    – Add;
 *     ```
       float: left;
       ```
   
 * On `.nav_main li`
 *  Thread Starter [kylemcburnie](https://wordpress.org/support/users/kylemcburnie/)
 * (@kylemcburnie)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299040)
 * Got it Andrew, now they appear un-stacked but on the menu bar
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299041)
 * Now add;
 *     ```
       float: none;
       ```
   
 * To `.nav_main li li`
    (new style)
 * I think you forgot to add `position: relative;` to the specified element. Let’s
   wait until you do.
 *  Thread Starter [kylemcburnie](https://wordpress.org/support/users/kylemcburnie/)
 * (@kylemcburnie)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299043)
 * Hey Andrew, I added the new style which stacks them!
    For the position: relative;
   I added it to the .nav_main { position:relative; margin:0;}
 * is this incorrect?
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299044)
 * My mistake, add it to `.main_nav li`.
 *  Thread Starter [kylemcburnie](https://wordpress.org/support/users/kylemcburnie/)
 * (@kylemcburnie)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299046)
 * Alright there we go
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299047)
 * Now you can mess around with the `top` and `left` values of `.nav_main li ul`
   to position your submenu where you want.
 *  Thread Starter [kylemcburnie](https://wordpress.org/support/users/kylemcburnie/)
 * (@kylemcburnie)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299050)
 * Thanks so much Andrew!

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

The topic ‘Submenu items lining up incorrectly’ is closed to new replies.

 * 10 replies
 * 2 participants
 * Last reply from: [kylemcburnie](https://wordpress.org/support/users/kylemcburnie/)
 * Last activity: [13 years, 4 months ago](https://wordpress.org/support/topic/submenu-items-lining-up-incorrectly/#post-3299050)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics