如何强制div换行

下面这个 help-block 的文字总是和虚线框同一行
有没有什么方法让其换行?

clipboard.png

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;
}
阅读 22.2k
2 个回答

检查 .help_block 及同级 div 的 display 属性和 float 属性。
div 默认为 display:block ,就是一行一个的。
两个 div 同一行的话说明 display 值被修改过,或者可能有 float 情况。

div本身作为块级元素,本来就默认一行一个,除非你修改了display属性,或者设置了宽度。
你可以在你想要换行的div上,用style的形式强调一些display:block属性.

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题