2
.container {
max-width: 1232px;
min-width: 200px;
margin: 0px auto;
font-family: Tahoma, Geneva, sans-serif;
}
.grad {
content: "";
display: block;
height: 8px;
width: 100%;
background: linear-gradient(45deg, rgb(133, 184, 1) 0px, rgb(26, 148, 189) 77%, rgb(26, 148, 189) 100%);
margin-bottom: 3px;
}
ul {
padding: 0px;
margin: 0px;
}
.card {
list-style: none;
background-color: rgb(36, 43, 51);
margin: 0px;
padding-right: 1px;
width: 175px;
height: 250px;
display: inline-block;
margin-right: -5px;
margin-top: -3px;
border-bottom: 1px solid rgb(88, 95, 101);
cursor: pointer;
}
.card:hover {
background-color: rgb(0, 0, 0);
}
.card-block {
margin-top: 50px;
border-right: 1px solid rgb(88, 95, 101);
width: 100%;
height: 150px;
}
h2 {
margin: 0px;
padding: 0px;
}
<div class="container">
<div class="grad"></div>
<ul>
<li class="card">
<div class="card-block">
<h2>Location</h2>
</div>
</li>
<li class="card">
<div class="card-block"></div>
</li>
<li class="card">
<div class="card-block"></div>
</li>
<li class="card">
<div class="card-block"></div>
</li>
<li class="card">
<div class="card-block"></div>
</li>
<li class="card">
<div class="card-block"></div>
</li>
<li class="card">
<div class="card-block"></div>
</li>
<li class="card">
<div class="card-block"></div>
</li>
</ul>
</div>
之前,我将我的位置是看起来不错,但它把我的第一个项目,现在下来了吗?
我想在我的卡块div中写入几条不同的信息。
我不确定我只要一插入,或为什么我要有以及
duplicate - http://stackoverflow.com/questions/9670469/css-vertical-alignment-of-inline-inline-block-elements –