V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member Sign In
This topic created in 5488 days ago, the information mentioned may be changed or developed.
经常可以看到一行中左边显示头像，右边显示内容的设计，大家是怎样实现的？
V2EX是直接用table布局。
Twitter是把头像设为float:left。
新浪微博是把内容设为float:right。
Google Reader的i界面是将图标绝对定位，内容设置padding-left。
我习惯让内容用绝对定位，并用left留出左边的空间放图片；或者图片绝对定位，内容设置margin-left（其实和Google Reader的做法差不多）。
不知道大家是怎么做的，各有什么优点？
V2EX是直接用table布局。
Twitter是把头像设为float:left。
新浪微博是把内容设为float:right。
Google Reader的i界面是将图标绝对定位，内容设置padding-left。
我习惯让内容用绝对定位，并用left留出左边的空间放图片；或者图片绝对定位，内容设置margin-left（其实和Google Reader的做法差不多）。
不知道大家是怎么做的，各有什么优点？
 |
1
romoo Apr 19, 2011
以前喜欢用 float，现在多用绝对定位。没有分析过优缺点。
好奇 V2EX 回复为什么要用 table 呢？ |
 |
2
supersheep Apr 19, 2011
我习惯浮动加margin
百度贴吧就不说了，豆瓣以前貌似也是用table的。 后端程序员风格…… |
 |
3
BB9z Apr 19, 2011
确实没分析过优缺点，几次都是图片绝对定位，内容margin-left。
|
 |
4
yuest Apr 19, 2011
头像 float:left
内容 overflow:hidden 缺点是不要有交互的东西（如菜单）在内容里面绝对定位显示超出内容框 |
 |
5
lamengao Apr 19, 2011
我喜欢绝对定位，简单直观跨浏览器，缺点是如果以后要添加删除元素会增加维护难度。
|
|
6
yuest Apr 19, 2011
可能 google 这种方式更好吧。内容只要设一个 min-height 就可以了
而且如果两边要不同背景颜色的话，把 margin-left 改成 border-left 就行 |
Select Language