1

我有一个 UL，它在宽窄宽度中正确居中，但在中间范围内中断。当它很宽时，一切都很好，当浏览器很窄时，一切都很好，但是当使用中间宽度时，比如 800px 宽，菜单会换行到下一行，这目前可以工作，但我想看看它是否是可以使第二行链接居中。这是它在顶部的外观（红色圆圈）以及我希望它在底部（绿色圆圈）做什么的屏幕截图。

在此处输入图像描述

如果您查看另一个线程，您将在他的示例链接中看到我的菜单现在是如何工作的。如果您在他的示例中缩小浏览器，您会注意到菜单换行并且第二行左对齐。

我想让第二行在第一行下方居中，如上图所示。这可能吗？

这是HTML：

<div id="navContainer" 
    <ul>
        <li class="menu_home"><a href="/">Home</a></li>
        <li class="menu_gallery squished"><a href="/galleryIntro.php">Gallery of Properties</a></li>
        <li class="menu_service"><a href="/service.php">Service Options</a></li>
        <li class="menu_contact"><a href="/contact.php">Contact Us</a></li>
        <li class="menu_test"><a href="/panos/laakona2/">Testing HotSpots</a></li>
    </ul>
</div>

我不认为 CSS 是必需的，因为它并没有像我想要的那样工作（它分布在大约 38 个不同的 CSS 文件中，所有内容都向左浮动，但如果你认为我可以在这里添加 css可能会有所帮助，但无论如何我都愿意放弃一切......）

4

1 回答 1

1

添加

text-align:center;

到 .nav ul 在您的 Tinkerbin 示例中。

或者：

   #navContainer ul {
         text-align:center;
    }

到你自己的 CSS

于 2013-05-18T13:27:32.177 回答