对齐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>

这是图片，我要输出

由于某种原因，代码无法正常工作，所以这是我的演示 sn-p 的链接 Demo Snippets

Answer 1

你必须为此添加一些 css

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

Updated Codepen