恶魔。我被困在引导网格中。
正如我们所知,bootstap为其.span *
添加了一些余量,因此,我需要删除该边距以显示多个跨度而不添加任何行。
我已经从twitter bootstrap定制下载生成了我的CSS。我将排水沟设为0,以便不应将余量添加到span*
。
但它无法在响应模式下工作。请帮我添加以下代码的响应功能:
.no-gutter.row-fluid [class*="span"]:first-child {
margin-left: 0;
}
.no-gutter.row-fluid .controls-row [class*="span"] + [class*="span"] {
margin-left: 0%;
}
.no-gutter.row-fluid .span12 {
width: 99.99999999999999%;
*width: 99.93055555555554%;
}
.no-gutter.row-fluid .span11 {
width: 91.66666666666666%;
*width: 91.59722222222221%;
}
.no-gutter.row-fluid .span10 {
width: 83.33333333333331%;
*width: 83.26388888888887%;
}
.no-gutter.row-fluid .span9 {
width: 74.99999999999999%;
*width: 74.93055555555554%;
}
.no-gutter.row-fluid .span8 {
width: 66.66666666666666%;
*width: 66.59722222222221%;
}
.no-gutter.row-fluid .span7 {
width: 58.33333333333333%;
*width: 58.263888888888886%;
}
.no-gutter.row-fluid .span6 {
width: 49.99999999999999%;
*width: 49.93055555555555%;
}
.no-gutter.row-fluid .span5 {
width: 41.66666666666666%;
*width: 41.597222222222214%;
}
.no-gutter.row-fluid .span4 {
width: 33.33333333333333%;
*width: 33.263888888888886%;
}
.no-gutter.row-fluid .span3 {
width: 24.999999999999996%;
*width: 24.930555555555554%;
}
.no-gutter.row-fluid .span2 {
width: 16.666666666666664%;
*width: 16.59722222222222%;
}
.no-gutter.row-fluid .span1 {
width: 8.333333333333332%;
*width: 8.263888888888888%;
}
.no-gutter.row-fluid .offset12 {
margin-left: 99.99999999999999%;
*margin-left: 99.8611111111111%;
}
.no-gutter.row-fluid .offset12:first-child {
margin-left: 99.99999999999999%;
*margin-left: 99.8611111111111%;
}
.no-gutter.row-fluid .offset11 {
margin-left: 91.66666666666666%;
*margin-left: 91.52777777777777%;
}
.no-gutter.row-fluid .offset11:first-child {
margin-left: 91.66666666666666%;
*margin-left: 91.52777777777777%;
}
.no-gutter.row-fluid .offset10 {
margin-left: 83.33333333333331%;
*margin-left: 83.19444444444443%;
}
.no-gutter.row-fluid .offset10:first-child {
margin-left: 83.33333333333331%;
*margin-left: 83.19444444444443%;
}
.no-gutter.row-fluid .offset9 {
margin-left: 74.99999999999999%;
*margin-left: 74.8611111111111%;
}
.no-gutter.row-fluid .offset9:first-child {
margin-left: 74.99999999999999%;
*margin-left: 74.8611111111111%;
}
.no-gutter.row-fluid .offset8 {
margin-left: 66.66666666666666%;
*margin-left: 66.52777777777777%;
}
.no-gutter.row-fluid .offset8:first-child {
margin-left: 66.66666666666666%;
*margin-left: 66.52777777777777%;
}
.no-gutter.row-fluid .offset7 {
margin-left: 58.33333333333333%;
*margin-left: 58.19444444444444%;
}
.no-gutter.row-fluid .offset7:first-child {
margin-left: 58.33333333333333%;
*margin-left: 58.19444444444444%;
}
.no-gutter.row-fluid .offset6 {
margin-left: 49.99999999999999%;
*margin-left: 49.86111111111111%;
}
.no-gutter.row-fluid .offset6:first-child {
margin-left: 49.99999999999999%;
*margin-left: 49.86111111111111%;
}
.no-gutter.row-fluid .offset5 {
margin-left: 41.66666666666666%;
*margin-left: 41.52777777777777%;
}
.no-gutter.row-fluid .offset5:first-child {
margin-left: 41.66666666666666%;
*margin-left: 41.52777777777777%;
}
.no-gutter.row-fluid .offset4 {
margin-left: 33.33333333333333%;
*margin-left: 33.19444444444444%;
}
.no-gutter.row-fluid .offset4:first-child {
margin-left: 33.33333333333333%;
*margin-left: 33.19444444444444%;
}
.no-gutter.row-fluid .offset3 {
margin-left: 24.999999999999996%;
*margin-left: 24.86111111111111%;
}
.no-gutter.row-fluid .offset3:first-child {
margin-left: 24.999999999999996%;
*margin-left: 24.86111111111111%;
}
.no-gutter.row-fluid .offset2 {
margin-left: 16.666666666666664%;
*margin-left: 16.52777777777778%;
}
.no-gutter.row-fluid .offset2:first-child {
margin-left: 16.666666666666664%;
*margin-left: 16.52777777777778%;
}
.no-gutter.row-fluid .offset1 {
margin-left: 8.333333333333332%;
*margin-left: 8.194444444444443%;
}
.no-gutter.row-fluid .offset1:first-child {
margin-left: 8.333333333333332%;
*margin-left: 8.194444444444443%;
}
答案 0 :(得分:2)
你不需要......
.no-gutter.row-fluid [class*="span"] {
margin-left: 0;
}
而不只是..
.no-gutter.row-fluid [class*="span"]:first-child {
margin-left: 0;
}