html - 在 CSS 中设计网格视图是否存在问题

Question

获取不平衡网格视图设计。试图设计一排网格视图，但第一个已关闭。第一个和第二个，第三个使用不同的样式，但尝试修改但仍然无法正常工作。

https://codepen.io/levi88888/pen/wvWomNB

           <div class="view_wrap template-grid-view">
                   <div class="template-view_item">
                     <div class="template-add-item">
                      Content
                     </div>
                   </div>
                 
                      <div class="template-view_item">
                        <div class="template-vi_left">
                         template content
                        </div>
                        <div class="template-vi_right">
                          <strong class="d-block">template name</strong>
                          <small class="content">Edited at date time</small>
                        </div>
                      </div>

标签： htmlcss

Answer 1

你可以尝试设置你的

<div class="view_wrap template-grid-view">

通过在 CSS 文件中键入以下内容作为 flex 容器：

    .template-grid-view{
    display: flex;
    }

更多关于如何使用 flexbox 的信息可以在这里找到。