В Wordpress, подменю не отображается правильно

Question

Смотрите мой следующий код. Это меню на домашней странице,

<li id="menu-item-47" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-47"> 
<a href="http://localhost/project/service/">Service</a> 
    <ul class="sub-menu"> 
     <li id="menu-item-65" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-65"><a href="http://localhost/project/services/voice/">Voice</a></li> 
     <li id="menu-item-27" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-27"><a href="http://localhost/project/services/data/">Data</a></li> 
    </ul> 
</li> 

Он отображается правильно. Главное меню (услуга), имеющее 2 подменю (данные голоса &).

Проблема в том, что она отображает только последний пункт меню. (То есть показывает только data. Без дисплея voice). Смотрите следующий образ,

см изображение в following link

Если я добавить еще один подменю означает, что третья только отображение.

Answer 1

.main-navigation ul li ul li { 
    display: block; 
} 

Это должно исправить ваше подменю. Проблема в том, что элементы списка подменю были заданы как встроенные блоки и лежали друг над другом.

Answer 2

Ваше подменю ul и подменю li являются как наследующими, так и стилями типа отображения из меню верхнего уровня, которые являются неправильными для подменю.

.main-navigation ul li ul li { 
    display: block; 
    width: 100% 
} 

.main-navigation ul li ul { 
    width: 100% 
}