WordPress的：wp_nav_menu有時會搞砸

我使用WordPress的功能wp_nav_menu()來顯示我的WP菜單中創建的分層菜單。這裏的片段：WordPress的：wp_nav_menu有時會搞砸

<?php wp_nav_menu('show_home=1&menu_class=page-navi&sort_column=menu_order'); ?>

下面是它的HTML輸出：

<div class="menu-default-container"><ul class="page-navi" id="menu-default"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-127" id="menu-item-127"><a href="http://domain.tld/">Home Page</a></li> 
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-128" id="menu-item-128"><a href="http://domain.tld/?page_id=7">Il film</a> 
<ul class="sub-menu"> 
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-129" id="menu-item-129"><a href="http://domain.tld/?page_id=9">Di che cosa parla?</a></li> 
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-133" id="menu-item-133"><a href="http://domain.tld/?page_id=121">Una storia di occasioni</a></li> 
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-130" id="menu-item-130"><a href="http://domain.tld/?page_id=11">Il Regista</a></li> 
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-131" id="menu-item-131"><a href="http://domain.tld/?page_id=14">Il 「maestro」</a></li> 
</ul> 
</li> 
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-139" id="menu-item-139"><a href="http://domain.tld/?page_id=34">Incontri e discussioni</a></li> 
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-153" id="menu-item-153"><a href="http://domain.tld/?page_id=144">News ed eventi</a></li> 
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-141" id="menu-item-141"><a href="http://domain.tld/?page_id=36">Film e lavoro in classe</a> 
<ul class="sub-menu"> 
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-142" id="menu-item-142"><a href="http://domain.tld/?page_id=62">Il titolo del film</a></li> 
</ul> 
</li> 
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-134" id="menu-item-134"><a href="http://domain.tld/?page_id=23">Interviste</a></li> 
<li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-19 current_page_item menu-item-138" id="menu-item-138"><a href="http://domain.tld/?page_id=19">Sponsor e collaborazioni</a></li> 
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-151" id="menu-item-151"><a href="http://domain.tld/?page_id=148">Contatti</a></li> 
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-158" id="menu-item-158"><a href="http://domain.tld/?page_id=156">Credits</a></li> 
</ul></div>

的問題是，有時它的正確顯示：

enter image description here

..和別人不： enter image description here

我檢查了源代碼，它是相同的！：o

不知道該怎麼想。這些東西嚇倒我！：P 這裏的網站，如果你想嘗試重現這個（如果你是幸運的。在月圓之夜）..

來源

2014-09-02 MultiformeIngegno

如果源中的標記完全相同，那麼視覺差異必須歸因於CSS。 – henrywright 2014-09-02 16:57:08

他們都是頁面，相同（不是自定義）模板..我真的不知道：0 – MultiformeIngegno 2014-09-02 17:53:58

這是我看到它現在搞砸了的頁面：http://waiting4maestro.org/?page_id= 19 – MultiformeIngegno 2014-09-02 17:55:14

這是因爲這種風格發生：

ul li { 
display: inline; 
padding: 2px; 
}

將以下樣式添加到您的css應該可以解決您的問題：

.menu-default-container ul li { 
display: block !important; 
}

來源

2014-09-02 19:36:39 Howli

我現在要去嘗試，但是......爲什麼不同的渲染，如果CSS是相同的？：o – MultiformeIngegno 2014-09-02 23:03:13

因爲如果您查看頁面的源代碼，您將看到它是專門爲該頁面添加的。您可能需要在塊後添加'！important'。 – Howli 2014-09-02 23:41:42

WordPress的：wp_nav_menu有時會搞砸

回答

相關問題