小编Luc*_*cca的帖子

我要创建一个Bootstrap网格，其第二行占据页面的整个高度，其方式与Twitter bootstrap 3两列full height的方式非常相似。但是，使用Bootstrap 4的“ non-hacky”答案h-100似乎无效。这是代码及其输出：

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="wiewport" content="width=device-width, initial-scale=1 user-scalable=no">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <style>
    html {
        height: 100%;
    }
    body {
        min-height: 100%;
        background-color: lightblue;
    }
    main {
        background-color: yellow;
    }
    #second-row {
        background-color: green;
    }
    textarea {
        height: 100%;
        width: 100%;
    }
    </style>
  </head>
  <body>
      <main class="container-fluid h-100">
          <div class="row">
              <div class="col-sm-6">
                  Hello,
              </div>
              <div class="col-sm-6">
                  World!
              </div>
          </div>
          <div class="row h-100" id="second-row">
              <div class="col-sm-8">
                  <textarea></textarea>
              </div>
              <div …