html - CSS定位不起作用

Question

有时我观察到 CSS 定位属性没有按预期工作。下面是我的代码，

.position
{
position:absolute;
left:50%;
}

上面的代码应该将类的元素定位在屏幕的 50%，但它没有发生。要将其放置在所需的位置，我必须写“left:220%”这可能是什么原因。

提前致谢。

Answer 1

position: relative带有and的元素position: absolute不与屏幕（或者更确切地说，当前文档）相关，而是与带有or的下一个父元素相关。position: relativeposition: absolute

这是一个说明问题的 JSFiddle。

你没有办法用纯 CSS 来“突破”那个监狱。要相对于文档定位元素，您应该使其成为文档的直接子元素。