我有以下页面
如何将灰色部分和标题“开始分析”连同所有内容一起向左移动。
代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<link href="/static/css/bootstrap.min.css" rel="stylesheet" media="screen">
<script type=text/javascript src="/static/js/jquery.js"></script>
<script src="/static/js/bootstrap.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
</head>
<body>
<nav class="navbar navbar-default" role="navigation">
<!-- Brand and toggle get grouped for better mobile display -->
<!-- Removed IPD link -->
<!-- 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="/">Home</a></li>
<li><a href="/about">About Us</a></li>
<!-- changed name (seenu.andi-rajendran) -->
<li><a href="/select_doc">Detect Suspicious Passage(s)!</a></li>
<!-- Added Help -->
<li><a href="/help">Help</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</nav>
<div class="container" xmlns="http://www.w3.org/1999/html">
<!-- Changed heading -->
<h1>Start Analysis</h1>
<div class="jumbotron">
<div class="form-group">
<form action='/view_doc'>
<div class="form-group">
<label for="usr">Select Doc:</label>
<select name="doc">
<option value='source2'>source2</option>
<option value='hamlet_clean'>hamlet_clean</option>
<option value='test1'>test1</option>
<option value='Tz'>Tz</option>
<option value='test3'>test3</option>
<option value='emma_clean'>emma_clean</option>
<option value='Gdp'>Gdp</option>
<option value='easy_source'>easy_source</option>
<option value='test2'>test2</option>
<option value='Ao'>Ao</option>
<option value='easy_test'>easy_test</option>
<option value='emma_and_shakespeare'>emma_and_shakespeare</option>
<option value='Vm'>Vm</option>
<option value='Rlm'>Rlm</option>
<option value='Ww'>Ww</option>
<option value='rowling_and_dickens'>rowling_and_dickens</option>
<option value='source1'>source1</option>
<option value='Tmm'>Tmm</option>
<option value='test4'>test4</option>
<option value='source3'>source3</option>
<option value='sample_files'>sample_files</option>
<option value='Aaf'>Aaf</option>
</select>
</div>
<br>
<div class="form-group">
<!-- Added heading -->
<h3>Style Model</h3>
<!-- Pushed style model loading option upwards-->
<div class="form-group">
<i>Load existing Style Model ?</i> 
<input type="radio" name='qload' value="yes"
onclick="document.getElementById('load_config').style.display = 'block';document.getElementById('over_config').style.display = 'block';"><i>Yes</i>
<input type="radio" name='qload' value="no"
onclick="document.getElementById('load_config').style.display = 'none';document.getElementById('over_config').style.display = 'none';"
checked><i>No</i><br>
</div>
<label>Atom Type:</label>
<input type="radio" class="atomClass" name="atom" value="paragraph">
paragraph 
<input type="radio" class="atomClass" name="atom" value="sentence">
sentence 
<input type="radio" class="atomClass" name="atom" value="nchars">
nchars 
</div>
<br>
<div class="form-group">
<label>Stylistic Feature(s):</label>
<select id="features" name="features" multiple>
</select>
</div>
<br>
<div class="form-group">
<!--Modified Clustering Method heading-->
<label>Clustering Method:</label>
<select name="cluster_method">
<option value="kmeans">kmeans</option>
<option value="agglom">agglom</option>
<option value="density_based">density_based</option>
<option value="hmm">hmm</option>
<option value="none">none</option>
<option value="cos">cos</option>
</select>
 <!--Modifiying cluster value-->
<label>No. of cluster:</label>
<select name="k">
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
<div class="form-group">
<!-- included creation/modification of style models(seenu.andi-rajendran)-->
<br><i>Save Style Model ?</i> 
<input type="radio" class="save_config" name="save_config" value="yes"
onclick="document.getElementById('fname').style.display = 'block';"><i>Yes</i>
<input type="radio" class="save_config" name="save_config" value="no"
onclick="document.getElementById('fname').style.display = 'none';" checked><i>No</i><br>
<div id="fname" class="form-group" style="display: none;"><i>Style Model file name</i> 
<input type="text" name="fname" value="" width="30" height="30"><br>
</div>
</div>
<div id="over_config" class="form-group" style="display: none;"><i>Overwrite Style Model ?</i> 
<input type="radio" name="over_config" value="yes"> <i>Yes</i>
<input type="radio" name="over_config" value="no" checked><i>No</i><br>
</div>
<div id="load_config" class="form-group" style="display: none;">
<i>Load Style Model</i> 
<select name="lname">
<option value='blah.json'>blah.json</option>
<option value='new'>new</option>
<option value='arun'>arun</option>
<option value='seenu_arun'>seenu_arun</option>
<option value='blah'>blah</option>
<option value='test'>test</option>
<option value='seenu'>seenu</option>
<option value='sddsds'>sddsds</option>
<option value='test7'>test7</option>
</select>
</div>
<div class="btn btn-default">
<input type='submit' value='Go'>
</div>
</form>
</div>
</div>
</div>
<!-- loading of stylistic features according to atom type when selected (seenu.andi-rajendran)-->
</body>
</html>
我正在使用 boostrap-min 3.0.0。我已经查看了一些现有的答案，但其中大部分都描述了如何传输文本和图像，这在我的案例中不起作用。请帮忙
最佳答案
你可以试试下面的样式，
.container{
float:left;
}
希望这对您有所帮助。
关于html - 将容器完全向左移动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41329278/