Title: Simple CSS. Customizing menu not working
Last modified: September 14, 2016

---

# Simple CSS. Customizing menu not working

 *  [tanckom](https://wordpress.org/support/users/tanckom/)
 * (@tanckom)
 * [9 years, 8 months ago](https://wordpress.org/support/topic/simple-css-customizing-menu-not-working/)
 * Hello,
 * So, I tried to implement a two column menu into my wordpress, using this CSS 
   code which I’ve found on the internet:
 *     ```
       .sub-menu-columns .sub-menu{
         display:inline-block; 
         width:500px !important;
         background-color:#FFFFFF;  
       } 
       .sub-menu-columns .sub-menu li{
         width:50% !important;  
       }
       .sub-menu-columns .sub-menu li a:hover{
         color:#FFFFFF;
       }
       .sub-menu-columns .sub-menu li:nth-child(even){
         float:right;
         border-left:2px;
         border-color: #404040;
       }
       ```
   
 * I added .sub-menu-columns as a CSS class for the top-level-menu “Products” at
   which only!! the two column sub menu should be seen.
 * I managed to get this to work. Now is the problem, since the menu is bigger in
   width, that I need to move the sub-menu container to the left. I also managed
   to solve this issue with this code:
 *     ```
       #mainnav ul li ul{
       	left:-400px;
       }
       ```
   
 * Now is the only thing, that all other Menus with submenus are moved to the left
   too (as you can see with “Contact/Support”)
 * My logical approach would be to edit the previous code to:
 *     ```
       #mainnav .sub-menu-columns .sub-menu ul li ul{
       	left:-400px;
       }
       ```
   
 * However that is not working.
    Any ideas maybe? Website: [https://xs-sol.com/](https://xs-sol.com/)

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

 *  [HudsonValleyWebDesign](https://wordpress.org/support/users/jaycbrf/)
 * (@jaycbrf)
 * [9 years, 8 months ago](https://wordpress.org/support/topic/simple-css-customizing-menu-not-working/#post-8182253)
 * Css has to more specific. Target just the first submenu like this:
 * #menu-item-51 ul.sub-menu {
    border-left: 5px none #404040; left: -400px; }
 *  Thread Starter [tanckom](https://wordpress.org/support/users/tanckom/)
 * (@tanckom)
 * [9 years, 8 months ago](https://wordpress.org/support/topic/simple-css-customizing-menu-not-working/#post-8182320)
 * But I want to use the CSS class: .sub-menu-columns
    as the one who defines which
   submenus shall be displayed in columns and which one normal

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

The topic ‘Simple CSS. Customizing menu not working’ is closed to new replies.

 * 2 replies
 * 2 participants
 * Last reply from: [tanckom](https://wordpress.org/support/users/tanckom/)
 * Last activity: [9 years, 8 months ago](https://wordpress.org/support/topic/simple-css-customizing-menu-not-working/#post-8182320)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics