1

我在 .net MVC4 中运行的 jquerymobile 中有这个页面

<div data-role="header" data-theme="b" data-position="fixed">
     <h3 style="color:white;">
            Name
    </h3>
 <a href="#" data_icon="back"> Back </a>

    <div data-role="fieldcontain" class="test_row">
        <fieldset data-role="controlgroup" data-type="horizontal" class="test_row">
            <input id="radio3" name="testType" value="2" type="radio" checked="checked" class="test_type">
            <label for="radio3" class="test_type">All tests</label>
            <input id="radio1" name="testType" value="0" type="radio" class="test_type">
            <label id="test_type_label" for="radio1" class="test_type" >Automated</label>     
            <input id="radio2" name="testType" value="1" type="radio" class="test_type">
            <label for="radio2" class="test_type">Manual</label>
        </fieldset>
    </div>
</div>

CSS

.test_row .ui-btn {
    text-align: center;
}
.ui-field-contain .ui-controlgroup-controls {
    width: 100%;
}
.ui-controlgroup-controls .ui-radio {
    width: 33.3%;
}

http://jsfiddle.net/ruds5/jsfiddle

当您调整结果大小时,中间单词(Automated)会被截断为较短的形式,末尾带有“...”。

是否可以防止在单词末尾截断?

4

2 回答 2

5

根据更新的问题,这是解决方案。文本样式用使用 class .ui-btn-inner,按钮文本样式被覆盖如下。

span.ui-btn-inner {
 white-space: nowrap !important;
 overflow: visible !important;
}

演示 JSfiddle

于 2013-03-31T12:16:45.793 回答
1

Omar 对以前版本的 Jquery mobile 是正确的。但是对于 1.4.1 版本,没有更多跨度,请使用:

.ui-btn-inline {
  white-space: nowrap !important;
  overflow: visible !important;
}
于 2014-02-24T06:59:15.987 回答