标签文本未在Bootstrap网格设置中自动换行
十二键军
我试图使标签不包装在Bootstrap3中，但似乎无法使其正常工作。
我尝试在标签上甚至放置“自动换行：中断单词”，但这似乎也没有破坏标签的句子。
我确实在文档中看到“将标签和控件包装在.form-group中以获得最佳间距”。但是我不能使用“ form-group”，我想如果我想使用引导程序divs来分别控制标签/答案的网格/表单布局（在xs上，标签/输入更便于移动，并扩展到筛选器的100％屏幕，但在sm +屏幕上，标签显示在输入的左侧，以节省屏幕空间）。
这是一个示例...将jsfiddle的右侧框架扩展得非常大，然后您会看到表单标签被放置在左侧，并且文本对齐方式正确，然后出现了问题。
http://jsfiddle.net/armyofda12mnkeys/nud64aq7/
没有包裹的第三个标签下面的图片： 
这是我用于标签/输入设置的基本代码：
<div class="col-xs-12 col-sm-4 label">
<label for="firstname">House Number and Street and longer label and longer label and longer label and longer label and longer label </label>
</div>
<div class="col-xs-12 col-sm-8 answer">
<input type="text" class="form-control" placeholder="Enter your house # here" />
</div>
疯子
如果您在小提琴中浏览DOM元素，您将看到以下代码label：
.label {
display: inline;
padding: .2em .6em .3em;
font-size: 75%;
font-weight: 700;
line-height: 1;
color: #fff;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: .25em;
}
只需删除属性或覆盖white-space: nowrap;或将属性设置为normal
更新1.0：只是为了阐明此CSS属性仅存在于Bootstrap v3中。在v4.x中，该white-space属性已从label元素中删除。
Update 2.0：人们一直在询问BS v4.1，并在他们的代码中查找label像普通文本一样的包装，并且不包含white-space属性。但是，我确实在输入组部分中注意到，某些正在使用的类确实包含white-space: nowrap（即input-group-text类）。修复方法是相同的，可以在单独的文件中覆盖属性，也可以编辑要使用的特定类white-space: normal。如果它发生在我看不到的其他部分中，请在评论中让我知道，我很乐意看一下！
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
文本未在Chrome的flexbox网格中换行
- 2
如何在标签中不包含标签的文本自动换行？
- 3
在javascript中设置的标签文本未在服务器端显示标签文本
- 4
Twitter Bootstrap按钮文本自动换行
- 5
Bootstrap下拉列表：如何使文本自动换行
- 6
未在Baseadapter中设置文本
- 7
文本未在IE EDGE中的flexbox中换行
- 8
预标签中的 HTML 自动换行自动居中字符
- 9
自动网格列中的文本修剪
- 10
换行标签下的文本换行
- 11
JavaFX TextArea如何使用自动换行符设置文本
- 12
每个单元格中的 UI 网格换行文本
- 13
如何在Tcl / Tk中自动在标签中换行？
- 14
标签中的LibGDX自动缩放文本
- 15
如何使用ExtJS 4.2.1在元素（文本，标签，显示字段）的文本中进行自动换行？
- 16
如何防止标签自动换行？
- 17
RegEx匹配关闭打开标签中的文本换行
- 18
在Tkinter中自动换行的单行文本输入UI元素？
- 19
当放置在ViewBox中时，TextBlock文本不会自动换行
- 20
多行文本标签未在Swift中包装
- 21
X轴文本标签未在d3中旋转
- 22
Quasar框架自动完成未在列表中显示文本
- 23
如何在 OO Basic Macro 中设置自动换行？
- 24
设置/地图标签未在PyAIML中编译
- 25
设置/地图标签未在PyAIML中编译
- 26
ExtJS 4.2标题文本换行时如何设置网格过滤器高度？
- 27
自动换行在巨型Bootstrap中不起作用
- 28
从文本文件读取要添加到标签的文本时，在标签中换行
- 29
JavaFX设置数组中的标签文本
我来说两句