jQuery mobile：分页按钮的位置

Question

我有以下标记（以及如下所示的结果显示）。

我希望Prev和Next按钮分别靠近左边（现在是这样）和底部列表分隔符的右边缘。

中间按钮（可能会更改为文本）位于中间位置。

我尝试了几乎所有常用技巧，例如text-align:right right:5px等，但没有成功。

有人可以通过CSS建议我使用可靠的跨浏览器方式吗？

 <ul data-role="listview" data-inset="true">
                <li data-role="list-divider"> Cars</li>
                <li><a href="acura.html">Acura</a></li>
                <li><a href="audi.html">Audi</a></li>
                <li><a href="bmw.html">BMW</a></li>
                <li data-role="list-divider">

                    <a href="index.html" data-role="button" data-inline="true" data-mini="true" data-icon="arrow-l">Prev</a>
                    <a href="index.html" data-role="button" data-inline="true" data-mini="true">1 of 2</a>
                    <a href="index.html" data-role="button" data-inline="true" data-mini="true" data-icon="arrow-r" data-iconpos="right">Next</a>

                </li>
            </ul>

您可以在此处查看实时示例：http://www.jsfiddle.net/yyshf

Answer 1

如果我理解你的意思，你可以浮动锚点并在两个最右边的锚点上添加一个边距：

http://jsfiddle.net/yyshf/1/

li.list-divider a
{
    float left;
}

li.list-divider a + a
{
    margin-left: 33%;
}
​

请记住，使用jQuery移动CSS，您必须将CSS添加到底部。您可能还需要向这些锚添加类以更具体地选择它们，否则它可能会使您的移动站点中的其他内容混乱。

Answer 2

您应该添加到<li data-role="list-divider"＆gt; （包含按钮跨度）以下样式：text-align: right;

请参阅http://jsfiddle.net/wF5qa/1/