css之absolute绝对定位(技巧篇)
无依赖的绝对定位
margin,text-align与绝对定位的巧妙用法
例子1：实现左右上角的图标覆盖，如图，
左边
1 .icon-recom { 2 position: absolute; 3 line-height: 20px; 4 padding: 0 5px; 5 background-color: #f60; 6 color: #fff; 7 font-size: 12px; 8 }
右边也是同样的原理，在绝对定位的基础上，加上margin：-36px即vip这个元素的宽度即可，不加的话会出现在蓝色图片的右边，上一篇讲到过位置跟随的特性，不明白可以去参考
1 .icon-vip { 2 position: absolute; 3 width: 36px; 4 height: 36px; 5 margin-left: -36px; 6 background: url(http://img.mukewang.com/5453048000015d8800360036.gif); 7 text-indent: -9em; 8 overflow: hidden; 9 }
例子2：下拉列表。通过上一个例子，是不是可以想到这种下拉的框应该怎么实现呢？
和例子1同样的道理，下拉框设置无依赖的绝对定位后，margin-top设置输入框的高度就行了
此外，如果在这种absolute和margin的基础之上，加上父级的text-align:center,可以实现水平居中的效果，非常惊人
