css - 锁定盒子到位 CSS

Question

我有一个正在 build 的网站，但有一点定位问题。我在内容部分有两个主要文本框，一个在左上角，一个在右下角。但是，当浏览器边缘移入时，框会移动到左侧的底部框和右侧的顶部框，因为我使用的是 position:absolute。我想知道是否有办法将它们锁定到位，或者在中间设置一堵“墙”，使它们无法被推过去。

    #contentleft {
font: normal 14px verdana, sans-serif;
width: 450px;height:275px;
overflow-wrap:normal;
word-wrap:break-word;
position:absolute;
left:550px;
top:175px;
}
#contentright {
font: normal 14px verdana, sans-serif;
margin:0 auto;width: 500px;height:275px;
overflow-wrap:normal;
word-wrap:break-word;
position:absolute;
right:550px;
bottom:100px;
}

Answer 1

如果两个文本框在父 div 中，则不要过度使用 css 定位。使 #contentleft {float: left}来控制定位。不要使用 position: absolute 因为当浏览器未最大化时，它会转到不同的位置。相反，使用 position: relative 以便定位仅在其父 div 内。