我使用 bootstrap 制作了一个 header 原型(prototype)。问题是我不明白为什么我的右侧有这么大的填充。如果我在 Корзина 之后再添加一个字母，HTML 会给我一个新行。我怎样才能摆脱这个自由空间？这是图像
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<body>
<!-- Navigation -->
<!-- Heading beginning -->
<div class="container">
<div class="jumbotron">
<div class="row">
<div class="col-md-2"><img src="http://placehold.it/75x75" id="nttLogo"></div>
<div class="col-md-8">
<input type="text" name="searchPattern" placeholder="Введите название лекарства, или препарата" id="searchForm">
<button type="button">Search</button>
<span class="glyphicon glyphicon-heart-empty"><p id="websiteSlogan">Отложенное </p></span>
<span class="glyphicon glyphicon-folder-open"><p id="websiteSlogan">Корзина</p></span>
</div>
<div class="col-md-8">
<small>Например, лекарства для диабетиков</small>
</div>
</div>
<nav class="navbar navbar-inverse" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Start Bootstrap</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Services</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
</div>
</div>
<!-- Heading end-->
</body>最佳答案
您需要将 col-md-8 增加到 col-md-10 并将元素向右浮动以移除右侧的空白空间。
这是更新的 demo
关于html - 为什么我使用 Twitter Bootstrap 获得太多像素来填充？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38997341/