可能从标题，不知道我要说什么意思。
那么习惯性的，贴张图，再对这张图解释一下：
上面就是个简单的demo， 红色正方形的相当于是个问号，对前面的文字进行解释的。
之前这种设置都是将红色方框编程块级元素，然后定位，后来发现这种做法很愚蠢，增加了直接的工作量，而且父元素中的position:relative给自己带来的兼容性问题，有时很不容易排查。
当我把鼠标放在红色区域时，显示对这个内容的解释。上面的例子是经常在使用中的一种布局，所以特意写出来，"填坑"吧。
<style> .dm { padding:5px; width:120px; font-size:14px; line-height: 1.5em; background: #f4f4f4;
} .dm div{display: inline-block;*display: inline;*zoom:1;width:20px;height: 20px;vertical-align:middle;background: red;position: relative;cursor:pointer;} .dm div span {position: absolute;bottom:24px;font-size: 12px;line-height: 12px;padding:5px;width:260px;background: beige;color:#777;box-shadow: 0 0 3px rgba(3,3,3,0.3);border-radius:5px;display:none;} .dm div span.lt { left:20px;
} .dm div:hover span{display: block;}
</style>
<div class="dm"> セクター単位/インテリジェントバックアップ<div><span class="lt">前者はすべてのセクターをバックアップしますが、後者は使用されたセクターのみバックアップします。</span></div>
</div>
上面的做法，无论我的内容如何变化，都能保证元素在适当的位置显示，而不是用定位的方法，如果内容变化了，这个布局也就打乱了。
这是内容增加后的效果：
总结自己以前的不足，让自己迈前一步。