对齐jQuery Mobile导航栏左右角的图标

Question

我正在使用以下代码将导航栏添加到我的移动网站。这里我在导航栏的左侧有两个图标。但是我想将Next图标放在右侧，这样两个图标就会出现在左侧和右侧的角落。

<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
  

    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>


 




    <div data-role="page">      

   
        <div data-role="footer" data-position="fixed" data-tap-toggle="false" data-theme="a">
            <div data-role="navbar" data-iconpos="left">
                <ul>
                    <li><a href="#one" data-icon="arrow-l" >Previous</a></li>
                    <li><a href="#two" data-icon="arrow-r" >Next</a></li>
                   
                </ul>
            </div><!-- /navbar -->                             
        </div> 

    </div>

这是图片，我想得到输出

由于某些原因，代码无效，所以这里是我的演示片段的链接 Demo Snippets

Answer 1

你必须为此添加一些css

.ui-block-b a .ui-btn-inner .ui-icon{
  left: auto;
  right: 5px;
}

<强> Updated Codepen