下面这个 help-block 的文字总是和虚线框同一行
有没有什么方法让其换行?
http://chuantu.biz/t6/3/15026...
[img]http://chuantu.biz/t6/3/15026...
<img src=http://chuantu.biz/t6/3/15026... />
<div class="span10">
<form:textarea path="StrategyEntity.financeSMS" id="financeSMS" maxlength="200" class="input-xxlarge" rows="4" htmlEscape="false"></form:textarea>
<div>
<button type="button" class="btn btn-default btn_template" value="{phoneNumber}">当前手机号</button>
<div style="border:1px dashed #444444" class="span10">
<center><p><strong>选项:</strong><p/></center>
<button type="button" class="btn btn-default btn_template"
value="{effect_mode_1}">等额本息
</button>
<button type="button" class="btn btn-default btn_template"
value="{effect_mode_2}">等额本金 A
</button>
<button type="button" class="btn btn-default btn_template"
value="{effect_mode_3}">等额本金 B
</button>
<button type="button" class="btn btn-default btn_template"
value="{effect_mode_4}">到期还本付息
</button>
</div>
</div>
<div class="help-block" word-break:break-all;>点击上述按钮选择,根据您的当前资金状况,以及您的风险意识,选择适合您的方案,以上述说明为主
</div>
</div>
FYI:
<div class="span10">上面还有几层 div
<div class="new-border sf1 sf3">
<div class="formField" style="display:none">
<div class="row-fluid">
<div class="span10">
其中
.new-border{width:100%;border:1px solid #f1f1f1;margin:0 0 25px 0;float:left;}
.row-fluid>div {
width: 100% !important;
margin: 0 !important;
}
而
.help-block,
.help-inline {
color: #707070;
font-size: 11px;
text-shadow: 0 1px 0 #fff;
}
.help-block {
display: block;
margin-top: 3px;
margin-bottom: 8px;
margin-left: 1px;
}
检查 .help_block 及同级 div 的 display 属性和 float 属性。
div 默认为 display:block ,就是一行一个的。
两个 div 同一行的话说明 display 值被修改过,或者可能有 float 情况。