首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >div在HTML和body之外扩展

div在HTML和body之外扩展
EN

Stack Overflow用户
提问于 2018-07-15 23:44:24
回答 1查看 1K关注 0票数 2

我有三个div与中心对齐,HTML和正文区域延伸到窗口之外,以容纳最后一个div,它还添加了一个滚动条。

My code

html,
body {
  margin: 0;
  border: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  position: relative;
}

p {
  margin: 0;
  padding: 0;
  border: 0;
}

.top {
  position: absolute;
  margin: 0;
  padding: 0;
  left: 50%;
  top: 0%;
  transform: translate(-50%, 0%);
}

.center {
  position: absolute;
  margin: 0;
  padding: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.bottom {
  position: absolute;
  margin: 0;
  padding: 0;
  left: 50%;
  top: 100%;
  transform: translate(-50%, -0%);
}
<html>

<head>
  <title>Position</title>
</head>

<body>
  <div class="container">

    <div class="top">
      <p>I am top div</p>
    </div>

    <div class="center">
      <p>I am center div</p>
    </div>

    <div class="bottom">
      <p>I am bottom div</p>
    </div>

  </div>


</body>

</html>

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51349857

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档