listview中的JQuery移动/输入文本

Question

我在listview条目中有几个输入字段。所以现在我正在努力 设置输入字段的CSS样式，使其看起来像普通的列表视图条目。

输入字段将由angular的ng-model填写，但这并不重要。

这是我到目前为止所做的，但我认为我需要有关保证金/填充等的帮助。

// CSS input
.ui-input-text{ 
  border: none !important;
  box-shadow: none !important;
  background-color : transparent;
}

// HTML
<ul data-role="listview" data-divider-theme="b">
<li data-role="list-divider">Verbraucher</li>
<li data-mini="true"> <a href="#">
// This should look like a "normal" listview entry!
<input type="text" ng-model="cust.firstname" name="cust_firstname" required>    
</a></li>
... 

两者看起来都一样！

Answer 1

尝试将以下内容添加到您的css中：

.ui-input-listview {
  margin-top: -1em !important;
  margin-bottom: -1em !important;
  margin-left: -0.5em !important; /* If you want to fix left as well */
  margin-right: -0.5em !important; /* If you want to fix right as well */
}

然后，对于listview中的输入，将类设置为ui-input-listview

<input class="ui-input-listview" type="text" ng-model="cust.firstname" name="cust_firstname" required="required">

jsFiddle here - http://jsfiddle.net/EnF2w/1/