我想把我所有的Category元素并排放在一起,但由于某种原因,我得到了两个元素-彼此并排,之后又开始了一个新的行,在左边我仍然有很多空间……
css
.category {
float: left;
width: 40%;
margin-right: 3.33333%;
margin-bottom: 3.33333%;
padding: 15px;
text-align: center;
box-sizing: border-box;
background: radial-gradient(white, white, whitesmoke);
border-radius: 3%;
}
.categorycover {
height: 100px;
-webkit-box-reflect: below 8px -webkit-gradient(linear, right top, right bottom, from(transparent), to(rgba(255, 255, 255, 0.2)));
}
模板
{% block content %}
{% for category in object_list %}
<div>
<span class="category">
<img class="categorycover" src="/media/{{ category.cover }}">
<h1>{{ category.title }}</h1>
<p>{{ category.post_set.count }}Posted element(s)</p>
<p>{{ category.description|readmore:10|linebreaksbr}}</p>
</span>
</div>
{% endfor %}
{% endblock %}
我必须放置一个页面宽度为100%的div容器吗?任何提示都会有帮助。
https://stackoverflow.com/questions/51071950
复制相似问题