如何使用flex-wrap？

Question

我有一些要放3 x 3而不是5 x 5的盒子。它们使用flex-wrap进行显示，我想知道是否可以通过调整它来改变尺寸和布局，以便每个盒子具有相同的大小和比例（例如图像均具有相同的大小等）。以下内容粘贴在我的header.php中，以便指定特定页面而不影响其他元素。

Css：

 <style>
    @media (min-width:768px) {
      .entry-content .event_listings {
        display: flex;
        flex-wrap: wrap;
      }
    }

    @media (min-width: 768px) {
      .entry-content .event_listings .event_listing {
        width: 20%;
        padding: 0 20px;
      }
    }

    @media (min-width: 768px) {
      .entry-content .event_listings .event_listing .box-layout {
        width: 100%;
        float: none;
        height: 100%;
      }
    }

    @media (min-width: 768px) {
      .entry-content .event_listings .event_listing .box-layout {
        display: flex;
        flex- direction: column;
      }
    }

    @media (min-width: 768px) {
      .entry. content .event_listings .event_listing .box-layout .event. title {
        flex-grow: 1;
      }
    }
</style>

这可以调整以实现我想要的吗？

HTML：

<div class="line-layout" style="display: none;">
    <li class="event_listing post-6985 type-event_listing status-expired 
    hentry" style="visibility: visible;" data-latitude="" data- longitude="">
        <div class="event-info-row-listing">
            <a href="https://adsler.co.uk/event/new-cross-and-deptford-free-film-festival/">
                <div class="row">
                    <div class="col-md-1">
                        <div class="organizer-logo">
                            <img alt="Deptford Film Festival" src="https://adsler.co.uk/wp-content/uploads/event-manager. 
                    uploads/event_banner/2019/05/2456d41f16399aed538d25b1cd32ad14.jpg">
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="event-title">
                            <h4>New Cross and Deptford Free Film
                                Festival</h4>
                            <div class="boxes-view-listing-registered- 
                        code">
                            </div>
                            <div class="event-organizer-name">
                                <normal>Deptford Film Festival
                                    <normal></normal>
                                </normal>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="date" <date>2019-05- 26</date>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="event-location">
                                <i class="glyphicon glyphicon-map-marker"></I>
                                London
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="event ticket">#free</div>
                        </div>
                        <div class="col-md-3"></div>
                    </div>
                </div>
            </a>
        </div>
    </li>
    <!-- Box Layout -->
    <a class="event_listing post-6985 type-event_listing status-expired 
    hentry" href="https://adsler.co.uk/event/new-cross-and-deptford- 
    free-film-festival/">
        <div class="box-layout">
            <div class="event-img"><img alt="Deptford Film Festival" src="https://adsler.co.uk/wp-content/uploads/event-manager. 
            uploads/event_banner/2019/05/2456d41f16399aed538d25b1cd32ad14.jpg">
            </div>
            <div class="boxes-view-box-registered-code"></div>
            <div class="event-title">
                New Cross and Deptford Free Film Festival
            </div>
            <div class="event-start-date">2019- 05-26</div>
            <div class="event-location">
                <i class="glyphicon glyphicon-map-marker"></i> London
            </div>
            <div class="box-footer">
                <div class="event-ticket">#free</div>
            </div>
        </div>
    </a>
</div>

页面：https://adsler.co.uk/find-an-event/