可能從標題，不知道我要說什么意思。
那么習慣性的，貼張圖，再對這張圖解釋一下：
上面就是個簡單的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>
上面的做法，無論我的內容如何變化，都能保證元素在適當的位置顯示，而不是用定位的方法，如果內容變化了，這個布局也就打亂了。
這是內容增加后的效果：
總結自己以前的不足，讓自己邁前一步。