gpt4 book ai didi

css - 我无法让 div 占据整个浏览器窗口

转载 作者:行者123 更新时间:2023-11-28 16:54:46 28 4
gpt4 key购买 nike

我试图让 div 的边框与浏览器窗口边缘齐平。

我加载了一些 css-resets;清除了页面上的所有内容,除了 [文本] 测试行 - 并且边框似乎从页面边缘消失了 -> 几乎就像“box-sizing: border-box”不起作用一样。我已经尝试了 margin: 0 的所有方法来让这个边距消失。我试过 position: fixed 和 position: absolute

enter image description here

Master.css 是唯一加载的样式表,没有内联覆盖。

..重置有html等等等等提取自 - master.css

html, body, div, span, applet, object, iframe, h1, h2, h3 .......
{
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}

#wholePageDiv {
margin: 0px;
padding: 0px;
border: solid 1px blue;
padding: 0;
z-index: 1;
position: fixed;
min-height: 99%;
min-width: 99%;
}
then the html
<div id='wholePageDiv'>
Test text<br>
</div>

蓝色边框未与浏览器窗口齐平。

最佳答案

为了使div 100% 高,body 和html 必须设置为100%值得一读box model

*,
:after,
:before {
box-sizing: border-box;
}

html {
height: 100%;
}

body {
height: 100%;
margin: 0;
padding: 0;
}

#wholePageDiv {
border: 1px solid blue;
height: 100%;
}
<div id='wholePageDiv'>
Test text<br>
</div>

关于css - 我无法让 div 占据整个浏览器窗口,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57485344/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com