引导3.0网格新手问题

我想构建一个使用Bootstrap网格的表单，但遇到了一些问题。该页面可以在input-page 引导3.0网格新手问题

第一个问题是截面宽度。表单是5,5,2 = 12，但是在两个5列中元素无法正确显示。

第二我如何获得输入字段相对于彼此更近？

第三我如何获得相同的垂直大小的列，以便它不显示主背景色？

来源

2014-09-05 gharryh

将input宽度从100%更改为auto，这将允许占位符可见。

.form-group需要调整padding-bottom使输入字段彼此更接近。

对于背景，这是bootstrap的缺陷之一。它不允许有相同的高度。有几种方法可以解决这个问题，表格单元格是最常见的。我在该行上使用了一个类，因此如果我有其他不需要的行，我可以专门针对该部分。然后，你需要清除

.row.equal-height { 
    display: table; 
} 

.row.equal-height [class*="col-"] { 
    float: none; 
    display: table-cell; 
    vertical-align: top; 
    background-color: #D4BD72; 
} 

    @media screen and (max-width:767px){ 
    .row.equal-height{ 
     float:left; 
     width:100%; 
     text-align:center; 
    } 
}

我去看看，如果我能得到这个在Bootply你:)覆盖将需要采取内部表单组中列的工作。

见工作http://www.bootply.com/RSBHrQeOZ6

来源

2014-09-05 16:24:21 Aibrean

“对于背景，这是bootstrap的缺点之一”我认为这是CSS中的一个错误，CSS并不容易/可能创建完美的网格系统。 – cvrebert 2014-09-05 20:56:18

@cvrebert Zurb有一个功能，可以协助已经构建到框架中的相同高度进行补偿。请参阅http://foundation.zurb.com/docs/components/equalizer.html。 Bootstrap没有任何东西，这就是为什么我说这是一个错误。 – Aibrean 2014-09-05 22:20:20

@Aibrean改变了它，但结果是在最少的怪。也许我错了点

来源

2014-09-07 12:58:59 gharryh

引导3.0网格新手问题

回答

相关问题