固定元素如何仅使用 CSS 将内容推送到页面？

我以前见过类似的问题，但答案通常包括 Jquery 等。我是菜鸟，我只想使用 CSS。 我有一个网页，上面显示一段文字：

<P>yes yes yes </P>
<P>yes yes yes </P>
<P class="move">Moving part</P>

当屏幕很小时，我希望最后一部分（班级移动）移动到顶部。这很好用：

.move {
    color: blue;
}
@media screen and (max-width: 600px) {
    .move {
        position: fixed;
        top: 0px;
    }
}

除了“移动部件”显示在文本上！怎样才能把文字往下推呢？我试过身高等等。

有position: sticky http://caniuse.com/#search=sticky，但仅在 FireFox 和 Safari 中受支持。

不幸的是，没有 JavaScript 的其他浏览器无法模仿这一点。

为此，需要在向下滚动页面时计算和修改顶部。我自己寻找过仅 CSS 的解决方案，但它似乎不存在，我的尝试也不起作用。

看看粘性Mojo http://mojotech.github.io/stickymojo/jQuery 插件或引导词缀 http://getbootstrap.com/javascript/#affix.