Question

我一直在阅读其他问题，但似乎无法解决我的问题。

我正在尝试创建两个占据屏幕50％的列。我已经做到了，但是由于某些原因我无法修复顶部的空白-我做错了什么？

这是我的代码：

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Test column</title>

    <link rel="stylesheet" href="main.css">
  </head>

  <body>
    <div class="container"><div class="col-left">
        hello
      </div><div class="col-right">
        hello
      </div></div>
  </body>
</html>

我的CSS：

html, body {
  padding: 0;
  height: 0;
}


.col-left {
  display: inline-block;
  width: 50%;
  background: #1DA1F2;
  height: 100vh;
}

.col-right {
  display: inline-block;
  width: 50%;
  height: 100vh;
}

Answer 1

那是一个保证金

html, body {
  padding: 0;
  height: 0;
  margin: 0;
}

CSS3内联块div页面顶部为白色

1 个答案: