css - 内联表单字段：jQuery-Mobile 中的搜索框和按钮

Question

这就是我想要实现的目标：

这就是我得到的：

请使用 web-kit 浏览器（Chrome 或 Safari）查看 JSFiddle：http: //jsfiddle.net/KqEqN/

当您缩小屏幕但仍有明显足够的空间放置按钮时，就会发生这种情况。我研究了 CSS，试图在按钮右侧找到某种填充，但找不到。还有那条水平线是从哪里来的？

Answer 1

我不熟悉 jQuery Mobile，所以我可能做错了。我的猜测是您必须添加额外的类而不是覆盖 jQuery Mobile 的主题。

修复包括：

.ui-input-search {
    width: 50px;
    display: inline-block;
}

在这里检查它：http: //jsfiddle.net/NqFhQ/