css - Jquery 移动 1.4.2 CSS : Button styling without overridding jQuery css elements

Question

我注意到在 jQuery 1.4.2 中，样式化项变得异常困难。看起来我再也无法设置除提供的 jQuery Mobile css 之外的任何样式。例如:

<input id="PlaceLocationButton" enableviewstate="true" onclick="Click()" type="button" value="Set Location" class="map_button top_row_map_button" runat="server" data-inline="true" />

.top_row_map_button{
    width: 15em !important;
}

无论我将宽度设置为 15 还是 15,00000，按钮大小都不会改变，直到我更改 ui-btn 类本身。这使得样式化单个按钮几乎不可能，除非我采用 jQuery 路线，这是非常不理想的。我理解这样做的原因(按钮样式应用在由 jQuery Mobile 创建的父 div 中)，但是必须有一种方法来正确设置按钮本身的样式吗？我在这里做错了什么？

编辑 其他一些失败的尝试:

<div class="top_row_map_button">
    <input id="PlaceLocationButton" enableviewstate="true" onclick="ClickGeocode()" type="button"
        value="Set Location" class="map_button" runat="server" data-inline="true" />
</div>

.top_row_map_button:nth-child(2){
    width: 15em !important;
}

.top_row_map_button:nth-child(1){
    width: 15em !important;
}

.top_row_map_button {
    width: 15em !important;
}

同样，除非我为 jQuery Mobile 生成的 div 元素设置样式，否则我不能这样做，因为在加载页面之前我无法访问该元素(除非我在 css 中设置类的样式，这是我试图避免的)

Answer 1

对于那些在 Future 中找到这篇文章的人，ezanker 通过使用 data-wrapper-class 提供了一个很好的解决方案(评论)。

<input id="PlaceLocationButton" enableviewstate="true" onclick="Click()" type="button" value="Set Location 1" data-inline="true" data-wrapper-class="top_row_map_button" />

.top_row_map_button {
    width: 15em;
}

这是他的 fiddle .