WordPress页脚菜单-单行格式答案

【问题标题】：WordPress Footer Menu - Format On Single LineWordPress页脚菜单-单行格式
【发布时间】：2013-01-22 06:47:35
【问题描述】：

我能够为 WordPress 20 主题创建第二个菜单并将其添加到我的子主题的页脚。我在子主题页脚中修改的代码如下：

<div id="site-info">
<!-- EDIT -->
Copyright (c) 2013 Acme Inc. All rights reserved.
<?php wp_nav_menu( array( 'theme_location' => 'footer-menu' ) ); ?>
<!-- EDIT -->
</div><!-- #site-info -->

页脚菜单有效，但格式不正确。当前格式如下：

Copyright (c) 2013 Acme Inc. All rights reserved.
- Privacy Policy
- Terms & Conditions

我想要格式，所以所有内容都保持在带有“|”的单行上分隔隐私政策和条款和条件的符号。我也想松开子弹（不确定它们是从哪里来的？）。像这样：

Copyright (c) 2013 Acme Inc. All rights reserved. Privacy Policy | Terms & Conditions

我认为这是一个 CSS 问题，但我不确定？

浏览器呈现的页脚部分：

    <div id="footer" role="contentinfo">
        <div id="colophon">
            <div id="site-info">
                <!-- EDIT -->
                Copyright &copy; 2013 Acme Inc. All rights reserved.
                <div class="menu-footer-container">
                <ul id="menu-footer" class="menu">
                    <li id="menu-item-48" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-41 current_page_item menu-item-48">
                        <a href="http://www.kb8b.com/?page_id=41">Privacy Policy</a>
                    </li>
                    <li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49">
                        <a href="http://www.kb8b.com/?page_id=39">Terms & Conditions</a>
                    </li>
</ul></div>                <!-- EDIT -->
            </div><!-- #site-info -->

            <div id="site-generator">
                <!-- EDIT -->
                <!-- EDIT -->
            </div><!-- #site-generator -->

        </div><!-- #colophon -->
    </div><!-- #footer -->

</div><!-- #wrapper -->

【问题讨论】：

您可以粘贴在浏览器中呈现的 HTML 吗？
添加了由浏览器呈现的页脚部分。

标签： css wordpress

【解决方案1】：

将display 属性设置为inline 或inline-block 用于列表元素。

【讨论】：

【解决方案2】：

在子主题目录中的style.css 中，添加以下行：

ul#menu-footer li
{
    float: left;
    list-style: none;
}

您还必须为<ul> 本身设置一个宽度并调整其位置。

【讨论】：

它们仍然在单独的行上，现在它们重叠了，并且项目符号仍然存在。
我添加了您应该使用的规则。您是否为 UL 分配了宽度？并正确定位？

【解决方案3】：

在单个和删除项目符号中显示使用代码：-

 .menu-footer-container ul li
{
    float: left;
    list-style:none;
}

【讨论】：

它们仍然在单独的一行上，现在它们重叠了。