将框重新对齐为2x3

时间:2019-01-08 20:13:11

标签: html css

我的网站上有这些框,这些框长4个,下2个。但是我希望它是2x3,所以它的顶部是3,底部是3,这样看起来更干净更专业,但是我无法获得实际执行的代码。

这里是一个例子:

example

这是我拥有的代码:

<div class="tab-content">
                    <!--======= HOURLY =========-->
                    <div class="tab-pane active" id="hrs" role="tabpanel">
                        <!--======= PRICING ROW =========-->
                        <ul class="row"></ul><!--======= PRICE TABLE 1 =========-->
                        <div align="center">
                            <ul>
                                <li class="col-sm-6 col-md-3">
                                    <div class="price-inner">
                                        <div class="price-head">
                                            <h4><b>Basic Package</b></h4>
                                        </div>
                                        <p>32 Hours Of Clasroom</p>
                                        <p>14 Hours of in-car instruction</p>
                                        <p>Meets State Requirement</p><a class="btn" href="http://championsdrivingschools.com/checkout/product/basic-package/">Choose Package</a>
                                    </div>
                                </li>
                            </ul>
                        </div><!--======= PRICE TABLE 2 =========-->
                        <ul>
                            <li class="col-sm-6 col-md-3">
                                <div class="price-inner">
                                    <div class="price-head">
                                        <h4><b>Cruiser Package</b></h4>
                                    </div>
                                    <p>32 Hours Of Clasroom</p>
                                    <p>14 Hours of in-car instruction</p>
                                    <p>DADAP Certificate</p><a class="btn" href="http://championsdrivingschools.com/checkout/product/cruiser-package/">Choose Package</a>
                                </div>
                            </li><!--======= PRICE TABLE 3 =========-->
                            <li class="col-sm-6 col-md-3">
                                <div class="price-inner">
                                    <div class="price-head">
                                        <h4><b>V.I.P Package</b></h4>
                                    </div>
                                    <p>32 Hours Of Clasroom</p>
                                    <p>14 Hours of in-car instruction</p>
                                    <p>Priority Scheduling</p><a class="btn" href="http://championsdrivingschools.com/checkout/product/vip-package/">Choose Package</a>
                                </div>
                            </li><!--======= PRICE TABLE 4 =========-->
                            <li style="list-style: none; display: inline">
                                <div class="mobileHide">

                                </div>
                            </li>
                            <li class="col-sm-6 col-md-3">
                                <div class="price-inner papu">
                                    <div class="price-head">
                                        <h4><b>Road Lighting</b></h4>
                                    </div>
                                    <p>32 Hours Of Clasroom</p>
                                    <p>14 Hours of in-car instruction</p>
                                    <p>Lighting Fast Finish</p><a class="btn" href="http://championsdrivingschools.com/checkout/product/road-lightning-package/">Choose Package</a>
                                </div>
                            </li><!--======= PRICE TABLE 4 =========--><br>
                            <li class="col-sm-6 col-md-3">
                                <div class="price-inner">
                                    <div class="price-head">
                                        <h4><b>Blitz Package</b></h4>
                                    </div>
                                    <p>Customizable Schedule</p>
                                    <p>32 Hours Of Clasroom</p>
                                    <p>14 Hours of in-car instruction</p><a class="btn" href="http://championsdrivingschools.com/checkout/product/blitz-package/">Choose Package</a>
                                </div>
                            </li><!--======= PRICE TABLE 4 =========-->
                            <li class="col-sm-6 col-md-3">
                                <div class="price-inner">
                                    <div class="price-head">
                                        <h4><b>Drive Only Package</b></h4>
                                    </div>
                                    <p>7 Hours behind the wheel</p>
                                    <p>7 hours of in-car observation</p>
                                    <p>Meets State Requirement</p><a class="btn" href="http://championsdrivingschools.com/checkout/product/drive-only-package/">Choose Package</a>
                                </div>

                            </li>
                        </ul>
                    </div>
                </div>
            </div>

如果有人可以帮助我,我真的不知道该怎么做才能做到2x3

0 个答案:

没有答案