首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何在flexbox中每行显示3个项目?

如何在flexbox中每行显示3个项目?
EN

Stack Overflow用户
提问于 2018-01-26 23:29:40
回答 1查看 117.5K关注 0票数 57

我有一个列表,我想水平显示我的li元素,每行3个。我一直在试着得到我想要的,但是没有成功。有解决方案吗?

代码语言:javascript
复制
<div class="serv">
  <ul>                                             
    @foreach(App\Http\Controllers\HomeController::getservice($service->id) as 
    $key => $value)
    <li>
      <span class="h3-service">{{$value->title}}</span>
      <p>{!!$value->description!!}</p>
    </li>
    @endforeach
  </ul>
</div>

代码语言:javascript
复制
.serv ul {
  display: inline-flex;
  margin: 0;
  padding: 0;
  width: 33%;
  text-align: left;
  float: left;
}
.serv ul li {
  list-style: none;
  display: inline-block;
  padding: 0;
}
.serv ul li span {
  padding: 0;
}
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/48464444

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档