备用列表元素与css一起浮动

Question

我有一个页面，其中列出了使用ajax从数据库加载的消息。 目前它只是向下堆叠输出。

我想从左侧和右侧替换列表元素，类似于iOS消息聊天。 谁有任何提示？不能理解这个......

Answer 1

使用nth-child设置备用项的样式：

ul li:nth-child(even) {text-align:right;}

http://jsfiddle.net/W9eSK/

Answer 2

你可以左右浮动它们：

ul li:nth-child(even) {float:right;clear:left;}
ul li:nth-child(odd) {float:left;clear:right;}

jsFiddle