Element cyclic grid layout

as shown in the picture, I need to loop small pieces of col.


< div class= "block" >

                        <el-row gutter="18">
                            <el-col :span="6">
                                <el-card :body-style="{ padding: '0px' }" class="item">
                                    <div style="padding: 14px;">
                                    </div>
                                </el-card>
                            </el-col>
                            <el-col :span="6" v-for="(o, index) in 8" :key="o">
                                <el-card :body-style="{ padding: '0px' }" class="item">
                                    <img src="https://img.codeshelper.com/upload/img/2021/03/22/xm5ezsdkrp512067.jpg%401280w_1l_2o_100sh.jpg" class="image">
                                    <div style="padding: 14px;">
                                        <span></span>
                                        <div class="bottom clearfix">
                                            <time class="time">2017-08-09</time>
                                            <el-button type="text" class="button"></el-button>
                                        </div>
                                    </div>
                                </el-card>
                            </el-col>
                        </el-row>
                    </div>
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1e84734-46aa0.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1e84734-46aa0.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?