时间戳

首页 > 解决方案 > Div 离开屏幕

html - Div 离开屏幕

问题描述

我不知道如何解释它，但这里是代码：

CSS：

.top-container 
{
    background-color: #2f2f2f;
    float: left;
    width: 1920px;
}

HTML：

<html>
    <head>
        <link rel="stylesheet" href="style/main.css">
        <link href="https://fonts.googleapis.com/css?family=Comfortaa">
    </head>
    <body>
        <div class="top-container">
            <h1>
                Text
            </h1>
            <h4>
                some more text :)</b>
            </h4>
        </div>
    </body>
</html>

结果并不像预期的那样：

我所期望的

我得到了什么

标签： htmlcssscreen

解决方案

body边距默认为 8px，您需要将其设置为 0。

此外，将top-container宽度更新为 100%。

body {
  margin: 0;
}

.top-container {
  background-color: #2f2f2f;
  float: left;
  width: 100%; // fix this from 1920px to 100%
}
<html>

<head>
  <link rel="stylesheet" href="style/main.css">
  <link href="https://fonts.googleapis.com/css?family=Comfortaa">
</head>

<body>
  <div class="top-container">
    <h1>
      Text
    </h1>
    <h4>
      some more text :)</b>
    </h4>
  </div>
</body>

</html>

推荐阅读