左右竖的白线是我不要的(不是横的，那些是hr)。我不知道是什么原因造成的。
<div class="container">
<div class="row">
<div class="col-lg-11">
<div class="panel panel-default">
<div class="panel-body">
<div class="page-header">
<img src="img/banner.jpg" width="100%" />
<h1 class="text-center">POP UP MAKER MARKET</h1>
<h5 class="text-center">The place where SU's best designers, artists, makers and hackers can sell their work.
</br>
<h3 class = "text-center">APPLY BELOW</h3>
</div>
<form class="form-horizontal" method = "post" action="submit.php" enctype = "multipart/form-data">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Name:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="name" name = "name">
</div>
</div>
<div class = "form-group">
<label for="inputEmail3" class="col-sm-2 control-label">Email:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="email" name = "email">
</div>
</div>
<div class="form-group">
<label for="phoneNumber" class="col-sm-2 control-label">Phone:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="phone" name = "phone">
</div>
</div>
<div class="form-group">
<label for="major" class="col-sm-2 control-label">Major:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="major" name = "major">
</div>
</div>
<hr>
<div class="form-group">
<label for="itemForSale" class="col-sm-2 control-label">Item for Sale:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="itemForSale1" name = "itemForSale1">
</div>
</div>
<div class="form-group">
<label for="quantity" class="col-sm-2 control-label">Quantity:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id = "quantity1" name = "quantity1">
</div>
</div>
<div class="form-group">
<label for="price1" class="col-sm-2 control-label">Price:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="price1" name = "price1">
</div>
</div>
<div class = "form-group">
<label for="itemOneImg1" class="col-sm-2 control-label">Image 1:</label>
<div class="col-sm-10">
<input type = "file" accept=".jpg, .jpeg, .png" class = "form-control" name = "itemOneImg1">
</div>
</div>
<div class = "form-group">
<label for="itemOneImg2" class="col-sm-2 control-label">Image 2:</label>
<div class="col-sm-10">
<input type = "file" accept=".jpg, .jpeg, .png" class = "form-control" name = "itemOneImg2">
</div>
</div>
<button type="button" class = "btn-default" id="additional-files">Additional files</button>
<!-- Two -->
<div class = "show-onclick">
<hr>
<div class="form-group">
<label for="itemForSale2" class="col-sm-2 control-label">Item for Sale:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="itemForSale2" name = "itemForSale2">
</div>
</div>
<div class="form-group">
<label for="quantity2" class="col-sm-2 control-label">Quantity:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id = "quantity2" name = "quantity2">
</div>
</div>
<div class="form-group">
<label for="major2" class="col-sm-2 control-label">Price:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="price2" name = "price2">
</div>
</div>
<div class = "form-group">
<label for="itemTwoImg1" class="col-sm-2 control-label">Image 1:</label>
<div class="col-sm-10">
<input type = "file" accept=".jpg, .jpeg, .png" class = "form-control" name = "itemTwoImg1">
</div>
</div>
<div class = "form-group">
<label for="itemTwoImg2" class="col-sm-2 control-label">Image 2:</label>
<div class="col-sm-10">
<input type = "file" accept=".jpg, .jpeg, .png" class = "form-control" name = "itemTwoImg2">
</div>
</div>
</div>
<!-- END TWO -->
<button class = "show-onclick btn-default" type="button" id="additional-files1">Additional files</button>
<!-- THREE -->
<div class = "show-onclick1 form-group">
<hr>
<div class="form-group">
<label for="itemForSale3" class="col-sm-2 control-label">Item for Sale:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="itemForSale3" name = "itemForSale3">
</div>
</div>
<div class="form-group">
<label for="quantity3" class="col-sm-2 control-label">Quantity:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id = "quantity3" name = "quantity3">
</div>
</div>
<div class="form-group">
<label for="price3" class="col-sm-2 control-label">Price:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="price3" name = "price3">
</div>
</div>
<div class = "form-group">
<label for="itemThreeImg1" class="col-sm-2 control-label">Image 1:</label>
<div class="col-sm-10">
<input type = "file" accept=".jpg, .jpeg, .png" class = "form-control" name = "itemThreeImg1">
</div>
</div>
<div class = "form-group">
<label for="itemThreeImg2" class="col-sm-2 control-label">Image 2:</label>
<div class="col-sm-10">
<input type = "file" accept=".jpg, .jpeg, .png" class = "form-control" name = "itemThreeImg2">
</div>
</div>
</div>
<input id="submit" name="submit" type="submit" value="Submit" class="btn btn-primary pull-right">
</form>
</div>
</div>
</div>
</div>
<div class = "row">
<div class = "col-md-6">
<h3>DETAILS</h3>
<p>
The shop will be open from November 9th until Finals week in the Marshall Square Mall.
</p>
</br>
<p>
Dropoffs will take place on November 6th & 7th.
</p>
</br>
<p>
10% commission on sold items.
</p>
</div>
<div class = "col-md-6">
<h3>CONTACT</h3>
<p>
We can be reached at <a class = "link" href = "mailto:designtoable@gmail.com?Subject=Form%20Contact" target = "_top">designtoable@gmail.com</a>
</p>
</div>
</div>
</div>那是我的 HTML。
@font-face {
font-family: Futura;
src: url(futura-medium.tff !important);
color: #ffffff;
}
input[type="text"] {
color:white !important;
}
input[type="email"] {
color:white !important;
}
.model-content {
color:black !important;
}
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
.navbar-default {
background-color: #000000;
}
body {
background: #f05324 !important;
margin-bottom: 80px;
color: #ffffff;
}
.page-header, .panel-body, .panel, .panel-default, .col-lg-9, .row {
background: #f05324 !important;
}
.form-control{
background-color: #f05324;
color: #000000;
}
hr {
border-color: #ffffff;
background-color: #ffffff;
color: #ffffff;
}
.link {
color: #ffffff;
}
.page-header {
margin-top: 0;
}
.panel-body {
padding-top: 0;
}
.img-featured {
margin-top : 15px;
margin-bottom: 15px;
margin-right : 15px;
}
.img-project{
margin-top : 15px;
margin-bottom: 15px;
}
.show-onclick {
display: none;
}
.show-onclick1 {
display: none;
}
.block {
position: absolute;
top: 0;
bottom: 0;
left: 50%;
margin-left: // half the width of your img
}这是我的 CSS。
知道是什么原因造成的吗？这很烦人。
最佳答案
它实际上来自 panel-default 类。尝试:
.panel-default {
border: none;
}
这是你的 fiddle :http://jsfiddle.net/8vppzk1z/
关于html - 我的容器周围有白色边界线，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32850573/