我一直在尝试在行和列中设置8 div堆栈的样式,但是不能。我想在这些div中放置图标。尽管我认为拥有一张我想要的图片会更好,所以我附上了一个屏幕截图。善良的心,请帮忙。
这是代码:
<template name="User">
<div class="col-md-12">
<li class="user black {{selected}} results" id="user-link" style="font-family: 'candara'">
<span class="name" style="color: black; font-family: 'candara'"><i class="fa fa-warning" style="color: red;"></i> {{newschoolnamevar}}</span>
{{#if selected}}
<hr>
<div class="jokeInfo">
<div>
<span class="possy blue" style="color: black;">Motto: {{newschoolmottovar}}</span>
</div>
<br>
<div>
<span class="author" style="color: black;"> Author: {{author}}</span>
</div>
<br>
<div>
<span class="author" style="color: black;">Vision: {{newschholvisionvar}}</span>
</div>
<br>
<div>
<span class="author" style="color: black;">Mobile: {{mobile}}</span>
</div>
<br>
<div>
<span class="author" style="color: black;">Sell School: {{sellschoolvar}}</span>
</div>
<br>
</div>
{{/if}}
</li>
</div>
</template>
最佳答案
确定容器的LI,并给出以下信息:
ul {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
和LI:
li {
width: 25%;
}