大家是怎样分栏排版的?

2011-04-19 15:33:52 +08:00
 keakon
经常可以看到一行中左边显示头像,右边显示内容的设计,大家是怎样实现的?

V2EX是直接用table布局。

Twitter是把头像设为float:left。

新浪微博是把内容设为float:right。

Google Reader的i界面是将图标绝对定位,内容设置padding-left。

我习惯让内容用绝对定位,并用left留出左边的空间放图片;或者图片绝对定位,内容设置margin-left(其实和Google Reader的做法差不多)。

不知道大家是怎么做的,各有什么优点?
5614 次点击
所在节点    设计
6 条回复
romoo
2011-04-19 16:15:11 +08:00
以前喜欢用 float,现在多用绝对定位。没有分析过优缺点。

好奇 V2EX 回复为什么要用 table 呢?
supersheep
2011-04-19 16:31:29 +08:00
我习惯浮动加margin
百度贴吧就不说了,豆瓣以前貌似也是用table的。
后端程序员风格……
BB9z
2011-04-19 18:12:03 +08:00
确实没分析过优缺点,几次都是图片绝对定位,内容margin-left。
yuest
2011-04-19 18:17:28 +08:00
头像 float:left
内容 overflow:hidden
缺点是不要有交互的东西(如菜单)在内容里面绝对定位显示超出内容框
lamengao
2011-04-19 18:19:52 +08:00
我喜欢绝对定位,简单直观跨浏览器,缺点是如果以后要添加删除元素会增加维护难度。
yuest
2011-04-19 18:19:54 +08:00
可能 google 这种方式更好吧。内容只要设一个 min-height 就可以了
而且如果两边要不同背景颜色的话,把 margin-left 改成 border-left 就行

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/11743

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX