页面中的一个行内模块莫名下移了一段，已贴链接还请大佬帮忙找下原因多谢！

Question

求教！为什么这个right-block莫名其妙的下移了一段，本来应该是和图片一个水平位置的，找了半天没有发现原因所在，还请各位大佬帮忙看一下，多谢啦！下面是源网页和截的图。
网页展示链接

如图所示：

Answer 1

这是因为，inline-block的元素，会把它附近的文本都当成是可用文本，当然代码中换行的缩进也不例外：

    <div style="display: inline-block;">
        ...
    </div>
    <p> ... </p>

由于第一个div是inline-block，和<p>标签之间有换行和缩进，它会认为这些缩进是紧跟在这个inline-block元素之后的文本，所以会为这些文本预留出空间来，由于文本的行高和字体大小不为0，所以右边上面会被空白的预留空间挤出一定的位置来。

所以，有以下几个解决方法：

1. 使用absolute进行定位（不推荐，因为会使内容脱离文档流，不利于之后布局）

2. 使用float进行浮动，浮动可以有效地清除掉行内特性，这样这两个元素就不再是行内元素，也就不会出现这种问题了