word-break CSS存在的问题

Question

我正在使用在Android上与PhoneGap结合使用的jQuery Mobile。 我拥有CSS样式。

.itemClass p{
    width:100%;
    min-height:50px;
    text-transform:capitalize;
    word-break:break-all !important;
    word-wrap:break-word !important;
}

我正在动态创建ul，代码如下：

...
var out = '<ul data-role="listview">';
$(data["data"]).each(function(index, element){
    out += '<li class="itemClass"><p>' + element.text + '</p></li>';
});
out += "</ul>";
...

样式 word-break 和 word-wrap 不适用于项目。

- user3369485

---

似乎对我有效。http://jsfiddle.net/R7yTy/2/ - zsaat14

谢谢您的回答，但在我的情况下它不起作用。这可能与使用jQuery Mobile有关吗？ - user3369485

啊，没错，jQuery mobile拥有它自己的非常特别的样式表。你可以浏览一下它并查看是否有什么在这里覆盖了你的样式。 - zsaat14

Answer 1

你的代码是正确的。

它运行良好，查看此Fiddle页面。 但我们仍然可以尝试将“width”添加到其父级<li>中。

其他CSS可能会覆盖您的正确代码，这是一个可能性。

你可以试试这个：

.itemClass {
   width:100%;  
}

- Dharam Mali