我在屏幕上定位div时遇到困难。我希望它们内联放置,我已经指定了display:inline-block
或float:
或其组合。但是,每当我调整窗口大小时,div 都会消失或重新定位在彼此下方。我阅读了一个建议将div 封装在包装器div 中的解决方案并尝试了该解决方案,但我偶然发现了同样的问题,因为我希望包装器div 占据屏幕的整个高度而没有 y 溢出,所以如果我指定一个height:100%
每当窗口重新调整大小时,子元素都会重新调整大小;
------------------
header
------------------
div1 div2 div3
------------------
为了坚持你的设计,请将以下CSS代码添加到你的身体中:-
html, body {
width: 100%;
max-width: 100%;
margin: 0px;
}
wrapper {
position: relative;
width: 100%;
height: auto;
}
#divOne {
box-sizing: border-box;
display: block;
width: 30%;
float: left;
}
#divTwo {
box-sizing: border-box;
display: block;
width: 40%;
float: left;
}
#divThree {
box-sizing: border-box;
display: block;
width: 30%;
float: left;
}
给它们一个固定但相对的宽度将停止重新定位div
的问题。 在包装器div 中添加div1、div2 和div3。
注意:边框框属性将处理您添加的额外边距、边框或填充。