html - 如何使背景为浏览器高度 100% 的 DIV 中没有任何内容或内容较少

标签 html css css-float

我有密码

<html>
  <head></head>
  <body>
   <div id="main"> Hello world.!</div>
  </body>
</html>

和CSS

body{
  background-color: black;
}

#main{
  padding: 10px;
  background-color: blue;
}

请帮我弄个 100% 高度的背景。寻找 jsfiddle 链接。

最佳答案

.center-element {
    min-height: 100%;
    min-height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center;
    -ms-flex-direction: column;
    flex-direction: column;
}

关于html - 如何使背景为浏览器高度 100% 的 DIV 中没有任何内容或内容较少,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27854984/

相关文章:

css - 如何使位于另一个 div 下的 div 中的内容可访问/可点击?

javascript - 2011年为iOS/Android开发HTML5离线存储解决方案

javascript - 如何显示由onclick事件触发的div

CSS float 元素缺少第一个高度

CSS浮点: Why is float applied to the element just prior to the element to be floated?

html - 使用 CSS 网格的动态行

jquery - Javascript 通过复选框更改 div 的宽度

javascript - ng 类范围变量不起作用

javascript - 在 div 上使用可调整大小的函数将另一个分区移动到下一行

css - 将 DIV 格式化为 FLOAT LEFT 的右侧填充和列表问题