镀铬没有取最大宽度的列“col-lg-9”

时间:2017-11-11 06:01:24

标签: html css

镀铬没有占据“col-lg-3”和“col-lg-9”的最大宽度,宽度为100%。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" rel="stylesheet"/>
<body>
<table class="col-12 form_one">
  <tr>
    <td class="col-lg-3 col-md-3 col-sm-3">
      <h4>Project Information</h4>
    </td>
    <td class="col-lg-9 col-sm-9 col-md-9">
      <h4>Project Text .....</h4>
    </td>
  <tr>
</table>
</body>

1 个答案:

答案 0 :(得分:1)

为什么要同时使用表格和网格系统?

我建议你使用一个表(一个绝不会推荐用于布局目的)或一个具有更多语义上合适元素的网格系统,如:

<section class="row">
  <div class="col-lg-3 col-md-3 col-sm-3">
    <h4>Project Information</h4>
  </div>
  <div class="col-lg-9 col-sm-9 col-md-9">
    <h4>Project Text .....</h4>
  </div>
</section>

另请注意您忘记将列包装在.row元素中。

Codepen

上查看

我希望它有所帮助:)。