相对于父母的父母定位固定的孩子

时间:2015-06-22 07:13:36

标签: html css position css-position

所以我在浏览器窗口中创建了一个small_window,其中包含一个包含一些自动滚动文本的small_window。

我还希望small_window中的一些文本保持静态,而不是在small_window中滚动。所以这里pos_fixed是绝对的,相对于small_window。

<header>
<style type="text/css">
.small_window{
    position:relative;
}

#smaller_window{
    height:470px;
    overflow-x:hidden;
    overflow-y:auto;
    position: initial !important; /* I expect this would make pos_fixed a child of small_window instead of smaller_window */
}

p.pos_fixed {
position: absolute;
top: 200px;
right: 30px;
}
</style>
</header>

<body>
<div id="small_window">
    <div id="smaller_window">
        <p class="pos_fixed">This line is fixed relative to smaller_window</p>
    </div>
</div>
</body>

它就像Firefox38和IE11上的魅力一样。 但是,我怀疑它的跨浏览器兼容性,因为我的移动浏览器(chrome mobile)仍然相对于smaller_window定位pos_fixed,显然忽略了

#smaller_window{
    position: initial !important; 
}

有关更好的跨浏览器兼容方式建议相对于父母的父母定位固定子女的任何建议吗?

1 个答案:

答案 0 :(得分:0)

你没有为small_window添加类,但是你在css中为small_window编写id它将如何工作?你可以用小提琴发布你的代码吗?