Question

我正在使用最新的bootstrap 4.0，并且在Chrome浏览器中存在溢出表格的问题。

在Firefox中，它可以正确扩展：

我一直在尝试一些技巧和提示，但没有运气。我想知道Chrome实际上是否存在一些错误？

<html>
<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
</head>
<body>
<div class="container-fluid ">
    <div class="titled-container-header">
        Täiendkoolitused - Standardolukorrad
    </div>
    <div class="titled-container-body">
        <div class="row">
            <div class="col-sm-auto">
                <table class="table table-responsive table-secondary">
                    <tbody>
                    <tr valign="top">
                        <td class="label">Koolitusele pääsemise tingimused</td>
                        <td>Koolitus on mõeldud treeneritele,kelle treenitavad võistkonnad mängivad 11v11.

                        </td>
                    </tr>
                    <tr valign="top">
                        <td class="label">Info</td>
                        <td>Koolitus on mõeldud vähemalt EJL C litsentsi treeneritele, kelle treenitavad võistkonnad mängivad 11v11.
                            <br>
                            <br>Räägime standardolukordade tähtsusest jalgpallis -filosoofiad, trendid ja mängijate treenimise ning õpetamise
                            võimalustest.
                        </td>
                    </tr>
                    <tr valign="top">
                        <td class="label">Vabu kohti</td>
                        <td>22</td>
                    </tr>

                    </tbody>
                </table>

            </div>
            <div class="col-sm-auto pad-left">

                    <table class="table-bordered table-responsive table-primary">
                        <tbody>
                        <tr>
                            <th>
                                <label for="address">Elukoha aadress</label>
                            </th>
                            <td>
                                <input type="text" id="address" name="address">
                            </td>
                        </tr>
                        <tr>
                            <th>
                                <label for="phone">Telefon</label>
                            </th>
                            <td>
                                <input type="text" id="phone" name="phone">
                            </td>
                        </tr>
                        <tr>
                            <th>
                                <label for="email">Email</label>
                            </th>
                            <td>
                                <input type="text" id="email" name="email">
                            </td>
                        </tr>
                        <tr>
                            <th>
                                <label for="invoice_name">Arve saaja nimi</label>
                            </th>
                            <td>
                                <input type="text" id="invoice_name" name="invoice_name">
                            </td>
                        </tr>
                        </tbody>
                    </table>

            </div>
        </div>
    </div>
</div>
</body>
</html>

引导表从Chrome中的div溢出

0 个答案: