Html 引导的下拉按钮不在同一行上

我不确定我在这里的代码中做错了什么，但它与此或CSS相关。我不确定这将是什么CSS设置，但这是我的html代码的导航栏部分

TTT统计数据 另外

---

要回答你的第一个问题， 您可以将下拉列表放置在这样的结构中

<div class="container">
  <div class="row">
    <div class="col-md-2"> <!-- markup for dropdown 1 --> </div>
    <div class="col-md-2"> <!-- markup for dropdown 2 --> </div>
  </div>
</div>

您可以使用像这样的col类来使用bootstrap的网格系统进行页面布局。 要了解更多信息，请访问： 添加btn组类

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
            <div class="container-fluid">
                <div class="navbar-header">
                    <a class="navbar-brand" href="index.php">Scoreboards</a>
                </div>
                <div class="btn-group">
                    <div class="btn-group">
                        <button type="button" class="btn btn-default dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">
                            TTT Stats <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu">
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="index.php?page=tttkills">Total TTT Kills</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="index.php?page=tttdeaths">Total TTT Deaths</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="index.php?page=traitorkills">TTT kills as a traitor</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="index.php?page=traitorskilled">Traitors killed as an innocent/detective</a></li>
                        </ul>
                    </div>
                    <div class="btn-group dropdown2">
                        <button type="button" class="btn btn-default dropdown-toggle" id="dropdownMenu2" data-toggle="dropdown">
                            Other <span class="caret"></span> 
                        </button>
                        <ul class="dropdown-menu" role="menu">
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="index.php?page=playtime">Time Tracker</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="index.php?page=phkills">Total Prophunt Kills</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </nav>

---

你的第二个问题应该通过添加一个名为dropdown的类和dropdown2来解决，因为bootstrap的css不会理解它是一个dropdown。实际上，添加这些类似乎让我回到了原点。按钮相互堆叠，菜单在屏幕底部打开。不知道为什么，但它似乎在没有定义为下拉类的情况下工作得更好。有趣的是，我仍将在这方面工作一段时间，因为它仍然完全破碎。我在下面的评论中发布的两张图片显示了它现在的样子，以供参考。谢谢，我把它们放在了这个结构中，这实际上也解决了我的问题，即下拉菜单出现在正确的下面，尽管现在我只需要定位按钮。下面是它们现在的样子：虽然我们出于某种原因使任何css大小设置无效，但现在文本已经开箱了：我相信我可以找到一个解决方案，但感谢您解决了我的html方面的问题。编辑：还注意到当点击ttt统计下拉列表时，它会出现在标题下面，因此标题可能是相关的。这完全修复了它，一切都很好。非常感谢。