我尝试在导航栏的右侧显示一些文本。文档指出此类文本必须位于 p 标签内，并且类 navbar-text 和 navbar-right 应应用于此标签。我这样做了，但是文本向右浮动太远了。右边没有空格。
这是我的浏览器显示的内容:
这是我的 HTML:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<title>Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"
th:href="@{/webjars/bootstrap/3.3.2/css/bootstrap.min.css}" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-2.1.3.min.js" th:src="@{/webjars/jquery/2.1.3/jquery.min.js}"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"
th:src="@{/webjars/bootstrap/3.3.2/js/bootstrap.min.js}"></script>
</head>
<body>
<nav class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#main-nav">
<span class="sr-only">Navigation ein-/ausblenden</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">App</a>
</div>
<div class="collapse navbar-collapse" id="main-nav">
<ul class="nav navbar-nav">
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
<li><a href="#">Link 5</a></li>
</ul>
<p class="navbar-text navbar-right">Angemeldet als Max Mustermann</p>
</div>
</div>
</nav>
</body>
</html>
我错过了什么？
最佳答案
发生这种情况是因为在 Bootstrap 3.3.0 中引入了一个错误。已经有一个 issue以及 pull request在 GitHub。
关于html - 为什么我的导航栏中的右对齐文本向右移动太远？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28982176/