html - 当字符串很小时，col-xs 不起作用

Question

我的目的是对齐描述和一些代表对象描述的文本。所以在我的页面中我想要:

描述:(文本)(以这种方式对齐)

所以我的html代码是:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="form-group row">
  <label class="col-xs-1 col-form-label">Description:</label>
  <div class="col-xs-3">
    <label>ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa
    ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa
    ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa
    ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa
    ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa</label>
  </div>
</div>

在这种情况下，代码工作正常，因为它使描述符合我的需要。但是如果字符串有点像这个“sdfsdf”，结果就大不相同了，因为描述和字符串是一个在另一个之上。谁能帮帮我？

Answer 1

我无法重现您的错误。我唯一看到的是两个字符串在小屏幕上重叠，可以用较大的列值修复:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="form-group row">
  <label class="col-sm-1 col-xs-3 col-form-label">Description:</label>
  <div class="col-sm-3 col-xs-4">
    <label>ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa
    ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa
    ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa
    ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa
    ddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaaaa</label>
  </div>
</div>