0

我不知道如何摆脱按钮右侧的这条白线。这是问题所在:

http://cl.ly/image/2W0G1o2g3D47

这是我的代码:

    <!DOCTYPE html><html><style type="text/css">
        </style><head><title></title>

        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
        <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script></head><body>

        <div data-role="navbar" >
            <ul>
                <li><a id='button1' data-theme ="a" data-iconpos="top">Button 1</a></li>
                <li >  <a id='button2' data-theme ="a" data-iconpos="top">Button 2</a></li>
<li >  <a id='button3' data-theme ="a" data-iconpos="top">Button 3</a></li>
</ul>
        </div><!-- /navbar -->

        <div data-role="navbar" >
            <ul>
                <li><a id='button4' data-theme ="a" data-iconpos="top">Button 4</a></li>
                <li >  <a id='button5' data-theme ="a" data-iconpos="top">Button 5</a></li>

                <li >  <a id='button11' data-theme ="a" data-iconpos="top">Button 6     </a></li>
            </ul>
        </div><!-- /navbar -->

        <div data-role="navbar" >
            <ul>
                <li><a id='button6' data-theme ="a" data-iconpos="top">Button 7</a></li>
                <li >  <a id='button10' data-theme ="b" data-iconpos="top">Button 8</a></li>
            </ul>
        </div><!-- /navbar -->

    </body></html>
4

3 回答 3

1

为每一行的最后一个按钮设置一个类(即 class="lastbut")。然后,在 CSS 中这样做:

.lastbut {
   width:34% !important;
}

33%+33%+33% 等于 99%,你会看到白色的 1% 如果你想修复它,其中一个按钮应该是 34%。

于 2012-11-30T16:07:12.513 回答
0

我通过在导航栏 div 上使用 overflow-x:hidden 解决了这个问题:

<div data-role="navbar" data-iconpos="top" style="overflow-x:hidden">
于 2013-08-26T12:03:07.467 回答
0

在您的 CSS 中尝试以下代码:

.ui-grid-b > :nth-child(n) {
   margin-right: 0px!important;
 }
于 2012-11-30T16:10:52.130 回答