将盒子锁定到位 CSS答案

【问题标题】：Locking boxes in place CSS将盒子锁定到位 CSS
【发布时间】：2013-04-23 16:20:24
【问题描述】：

我正在建立一个网站，但有一点定位问题。我在内容部分有两个主要文本框，一个在左上角，一个在右下角。但是，当浏览器边缘移入时，th 框移动到左侧的底部框和右侧的顶部框，因为我使用的是 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;
}

【问题讨论】：

你试过position:fixed吗？

标签： css position css-position

【解决方案1】：

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

【讨论】：