JQuery Mobile 选项卡未对齐

Question

我目前正在构建一个 cordova 应用程序，在我的 android 手机屏幕上，选项卡如下所示：

上图是在 JSFiddle 中使用 JQuery 2.1.0 运行的，并且使用代码检查了 JQM 1.4.2 选项：

<div data-role="tabs" id="tabs">
  <div data-role="navbar">
    <ul>
      <li><a href="#">one</a></li>
      <li><a href="#">two</a></li>
      <li><a href="#">three</a></li>
    </ul>
  </div>
</div>

这里是请求的链接： https://jsfiddle.net/simonshout/18sssw7m/

我的 android 代码在这个模块中和周围包含了更多的 HTML，但它有点解决了我的 android 手机和 jsfiddle 都以错误的方式呈现这个的地方。那我错过了什么？

另外，经过一些测试，我发现在每个 li 类之间注入了一堆“nbsp”。我不知道是什么原因造成的，但我该如何阻止它？

Answer 1

好吧，很抱歉成为那个人，但我确实做了更多的挖掘工作，我发现了一个重复的线程：

How do I remove invisible "  " which has been automatically added to code

is there a way to highlight all the special accent characters in sublime text or any other text editor?

Answer 2

您需要在data-role="tabs" 中使用导航栏。

这是你的modified JSFiddle