Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/38.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css 引导列中的长文本会影响以下列_Css_Twitter Bootstrap - Fatal编程技术网

Css 引导列中的长文本会影响以下列

Css 引导列中的长文本会影响以下列,css,twitter-bootstrap,Css,Twitter Bootstrap,这说明了我所看到的问题。我添加了背景色以突出显示问题 请注意,为了查看问题,您需要在预览弹出窗口中查看plunkr,或者预览面板的宽度至少为800px。如果您以前从未这样做过,请参见下面的图片以获取要单击的按钮。一旦弹出,将屏幕放大一点 基本上,我发现如果我有,比如说4个'col-sm-6',它们通常并排坐着,给我2列2行 在其中一个子元素中出现一些长文本之前,这一切都是正常的。然后,这会将以下单元格推离对齐状态 我相信这是一个简单的解决办法,但我一直在逃避。。。有什么想法吗 Plunkr中的

这说明了我所看到的问题。我添加了背景色以突出显示问题

请注意,为了查看问题,您需要在预览弹出窗口中查看plunkr,或者预览面板的宽度至少为800px。如果您以前从未这样做过,请参见下面的图片以获取要单击的按钮。一旦弹出,将屏幕放大一点

基本上,我发现如果我有,比如说4个'col-sm-6',它们通常并排坐着,给我2列2行

在其中一个子元素中出现一些长文本之前,这一切都是正常的。然后,这会将以下单元格推离对齐状态

我相信这是一个简单的解决办法,但我一直在逃避。。。有什么想法吗

Plunkr中的代码是:

<div class="container">
  <div class="row">
    <div class="form-horizontal">
    <div class="col-sm-6">
        <div class="form-group">
            <label class="col-lg-5 control-label">Company</label>
            <div class="col-lg-6">A really long company name fs df sd fsdfsdfsdf sdf s df sd f sdf sd f sdfsdfsdfsdf</div>
        </div>
    </div>
    <div class="col-sm-6">
        <div class="form-group">
            <label class="col-lg-5 control-label">XYZ</label>
            <div class="col-lg-6">Something</div>
        </div>
    </div>
    <div class="col-sm-6">
        <div class="form-group">
            <label class="col-lg-5 control-label">XYZ</label>
            <div class="col-lg-6">Something</div>
        </div>
    </div>
    <div class="col-sm-6">
        <div class="form-group">
            <label class="col-lg-5 control-label">XYZ</label>
            <div class="col-lg-6">Something</div>
        </div>
    </div>
    </div>
  </div>
</div>

单位
一个很长的公司名称fs df sd FSDFSF sdf s df sdf sdf sdf sdf sdf DFSFDFDFSF
XYZ
某物
XYZ
某物
XYZ
某物
尝试使用两行

<div class="container">
  <div class="form-horizontal">
   <div class="row">
        <div class="col-sm-6">
            <div class="form-group">
                <label class="col-lg-5 control-label">Company</label>
                <div class="col-lg-6">A really long company name fs df sd fsdfsdfsdf sdf s df sd f sdf sd f sdfsdfsdfsdf</div>
            </div>
        </div>
        <div class="col-sm-6">
            <div class="form-group">
                <label class="col-lg-5 control-label">XYZ</label>
                <div class="col-lg-6">Something</div>
            </div>
        </div>
    </div>
    <div class="row" >

        <div class="col-sm-6">
            <div class="form-group">
                <label class="col-lg-5 control-label">XYZ</label>
                <div class="col-lg-6">Something</div>
            </div>
        </div>
        <div class="col-sm-6">
            <div class="form-group">
                <label class="col-lg-5 control-label">XYZ</label>
                <div class="col-lg-6">Something</div>
            </div>
        </div>
    </div>
  </div>
</div>

单位
一个很长的公司名称fs df sd FSDFSF sdf s df sdf sdf sdf sdf sdf DFSFDFDFSF
XYZ
某物
XYZ
某物
XYZ
某物

将其分成两行。每行中应该只有12列元素。为什么要进行向下投票?老兄,当它无缘无故出现的时候,真是太蠢了。。。谢谢看不见树林,看不见树木D(一旦允许,将标记为答案)也谢谢Darren我有时看不到正确的问题,因为被细节和多任务问题解决模糊了。。。干得好