div边框未包装内容css/html

我有一个带边框的div包装器，但是边框没有包装内容，我不知道为什么

下面是我的屏幕问题：

这就是我想要的：

下面是我的HTML代码：

<div class="event_area_table_termin">
                <div class="twelve columns">

                    <h3>Terminübersicht</h3>
                    <table>
                        <thead>
                            <tr>
                                <th>Titel</th>
                                <th>Startdatum</th>
                                <th>Enddatum</th>
                                <th>Wiederholung</th>
                                <th>Art</th>
                                <th>Aktion</th>
                            </tr>
                        </thead>
                        <tbody>   
                            <tr><td>Abendmarkt Osnabrueck</td><td>11.04.2014</td><td>18.04.2014</td><td>Täglich</td><td>Floh-, Trödel- &amp; Jahrmarkt</td><td><a href="" class="btn btn_orange" data-featherlight="#fl3" style="padding: 5px 12px;"><i class="fa fa-tint 2x" style="padding-left: 3px;"></i></a>
                                    <a href="/marktadresse/veranstaltungstermine-erstellen.html?area_id=OnRD4sBrvHZgAy4rK4&amp;event_id=1X4JxCOwhDpD4Oj5ch&amp;func=edit_event" class="btn btn_gray" style="padding: 5px 12px;"><i class="fa fa-pencil 2x" style="padding-left: 3px;"></i></a>
                                    <a href="#" class="btn btn_gray" style="padding: 5px 12px;"><i class="fa fa-eye 2x" style="padding-left: 3px;"></i></a>
                                    <a href="#" class="btn btn_gray" style="padding: 5px 12px;"><i class="fa fa-copy 2x" style="padding-left: 3px;"></i></a>
                                    <a href="/marktadresse/meine-veranstaltungen.html?event_id=1X4JxCOwhDpD4Oj5ch&amp;func=delete_event" class="delEvent btn btn_red" data-featherlight="#fl2" style="padding: 5px 12px;"><i class="fa fa-trash-o 2x" style="padding-left: 3px;"></i></a></td></tr><tr><td>Frühlingmarkt Osnabrück</td><td>19.04.2014</td><td>22.04.2014</td><td>Täglich</td><td>Floh-, Trödel- &amp; Jahrmarkt</td><td><a href="" class="btn btn_orange" data-featherlight="#fl3" style="padding: 5px 12px;"><i class="fa fa-tint 2x" style="padding-left: 3px;"></i></a>
                                    <a href="/marktadresse/veranstaltungstermine-erstellen.html?area_id=OnRD4sBrvHZgAy4rK4&amp;event_id=LKb77tAmVzeJJjE83LH&amp;func=edit_event" class="btn btn_gray" style="padding: 5px 12px;"><i class="fa fa-pencil 2x" style="padding-left: 3px;"></i></a>
                                    <a href="#" class="btn btn_gray" style="padding: 5px 12px;"><i class="fa fa-eye 2x" style="padding-left: 3px;"></i></a>
                                    <a href="#" class="btn btn_gray" style="padding: 5px 12px;"><i class="fa fa-copy 2x" style="padding-left: 3px;"></i></a>
                                    <a href="/marktadresse/meine-veranstaltungen.html?event_id=LKb77tAmVzeJJjE83LH&amp;func=delete_event" class="delEvent btn btn_red" data-featherlight="#fl2" style="padding: 5px 12px;"><i class="fa fa-trash-o 2x" style="padding-left: 3px;"></i></a></td></tr><tr><td>Herbstmarkt Osnabrück</td><td>18.04.2014</td><td>24.04.2014</td><td>Täglich</td><td>Floh-, Trödel- &amp; Jahrmarkt</td><td><a href="" class="btn btn_orange" data-featherlight="#fl3" style="padding: 5px 12px;"><i class="fa fa-tint 2x" style="padding-left: 3px;"></i></a>
                                    <a href="/marktadresse/veranstaltungstermine-erstellen.html?area_id=OnRD4sBrvHZgAy4rK4&amp;event_id=h0NTcpfUlinWbpwBbpB1&amp;func=edit_event" class="btn btn_gray" style="padding: 5px 12px;"><i class="fa fa-pencil 2x" style="padding-left: 3px;"></i></a>
                                    <a href="#" class="btn btn_gray" style="padding: 5px 12px;"><i class="fa fa-eye 2x" style="padding-left: 3px;"></i></a>
                                    <a href="#" class="btn btn_gray" style="padding: 5px 12px;"><i class="fa fa-copy 2x" style="padding-left: 3px;"></i></a>
                                    <a href="/marktadresse/meine-veranstaltungen.html?event_id=h0NTcpfUlinWbpwBbpB1&amp;func=delete_event" class="delEvent btn btn_red" data-featherlight="#fl2" style="padding: 5px 12px;"><i class="fa fa-trash-o 2x" style="padding-left: 3px;"></i></a></td></tr>                        </tbody>
                    </table>

                    <a href="/marktadresse/veranstaltungstermine-erstellen.html?area=Abendmarkt+Osnabrueck&amp;area_id=OnRD4sBrvHZgAy4rK4" class="btn btn_green right" style="text-decoration: none"><i class="fa fa-plus fa-lg" style="margin-right: 10px;
                                                                                                                                                                                                            position: relative;
                                                                                                                                                                                                            top: -1px;"></i>neuen Termin für Abendmarkt Osnabrueck erstellen</a> <br><br>
                    <a href="#" class="right" style="margin-top: 10px"><i class="fa fa-chevron-right fa-lg" style="margin-right: 5px;"></i>Alle Veranstaltungsorte</a>

                </div>
            </div>

终点站
滴度
Startdatum
端基准
维德霍隆
艺术
阿基翁
Abendmarkt Osnabrueck11.04.201418.04.2014TäglichFloh-，Trödel-&；贾尔马克
Frühlingmarkt Osnabrück19.04.201422.04.2014TäglichFloh-，Trödel-&；贾尔马克
赫伯斯特市场Osnabrück18.04.201424.04.2014TäglichFloh-，Trödel-&；贾尔马克

---

将

事件区域表终端的高度设置为
自动
。当前设置为
高度：112px

.event_area_table_termin {
    height: auto;
}

在您的例子中，类为“十二”和“列”的内部div得到了“float:left”样式，这实际上破坏了它的高度。这会导致外部div无法正确环绕内部div

除非它与样式的其余部分冲突，否则可以从内部div中删除“float:left”样式，即将其替换为float:none