将内容包裹在块上并使其在其周围流动？

Question

是否可以使用HTML5 / CSS创建效果，甚至可以创建一个模仿“流体”的障碍的JS？内容＆＃39;流动＆＃39;周围？

就像一个具有指定宽度和高度的块div元素，它以窗口中间为中心，所有其他内容动态调整，并且避免＆＃34;我们向下滚动的div。 div始终位于屏幕中央。

<div id="centerblock"></div>

<p>Donec ut vestibulum velit. Sed lorem enim, malesuada tristique lacinia eget, tempus eu libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Interdum et malesuada fames ac ante ipsum primis in faucibus.Praesent et risus ut neque suscipit sollicitudin vel tristique diam. Nulla molestie sagittis est, gravida aliquet leo faucibus in. Suspendisse volutpat cursus est sed bibendum. Mauris bibendum et eros in malesuada. Nunc rutrum ligula ut vehicula varius.
</p>
..More <p> paragraphs..

我试过的CSS：

#centerblock {
  width:200px;
  height:60px;
  background:green;
  margin:auto;
  position:absolute;
  z-index:1;
  top:0; bottom:0; left:0; right:0;
  display:inline-block;
}
* {
  z-index:1;
}

试图建立这种效果，但我不确定它是否可行：http://codepen.io/power-inside/pen/yyPzrO

Answer 1

以下是一个例子。

http://jsfiddle.net/ronansmith/u6dtsL6x/

.inside-block {
    float: left;
    width: 60px;
    height: 100px;
    background-color: green;
}

这可以在3个方向上围绕div进行单词。或者您可以使用float: right;使div保持正确。