引导列宽度问题

嗯，我自定义列宽为75px。引导列宽度问题

，如果我有这个

<div class="container-fluid"> 
    <div class="row-fluid"> 
     <div class="span1">some text</div> 
    </div> 
</div>

列有正确的宽度，但如果我有这个

<div class="container-fluid"> 
    <div class="span1">some text</div> 
</div>

列有不同的宽度。

来源

2013-07-10 papelucho

一些相关的CSS代码或链接到你的网站将是有益 –

我认为类=“排液”的CSS是有 –

尝试提供的jsfiddle也请。 – PeterFour

这是因为.row-fluid .span*宽度是百分比。如果您调整窗口浏览器的大小，则会看到列宽发生变化，在本例中为span1。

持有总960x75像素到SPAN1，把你的自定义CSS

.row-fluid .span1{ 
    width: 75px !important; 
    *width: 75px !important; 
}

来源

2013-07-10 07:30:58 rogelio

网格系统通常遵循创建布局严格的等级制度。

Twitter引导程序期望您的所有列都保留在行内。为bootstrap编写的CSS根据您给出的层次结构使用后代选择器。所以如果你改变层次结构，将要应用的规则将会不同。

以下从引导CSS提取可以把一些相同的光。

.row-fluid [class*="span"] { 
    display: block; 
    float: left; 
    width: 100%; 
    //Other properties removed for readability 
} 

.row-fluid .span12 { 
    width: 100%; 
    *width: 99.94680851063829%; 
} 

.row-fluid .span11 { 
    width: 91.48936170212765%; 
    *width: 91.43617021276594%; 
} 

.row-fluid .span10 { 
    width: 82.97872340425532%; 
    *width: 82.92553191489361%; 
} 

.row-fluid .span9 { 
    width: 74.46808510638297%; 
    *width: 74.41489361702126%; 
} 

.row-fluid .span8 { 
    width: 65.95744680851064%; 
    *width: 65.90425531914893%; 
} 

.row-fluid .span7 { 
    width: 57.44680851063829%; 
    *width: 57.39361702127659%; 
} 

.row-fluid .span6 { 
    width: 48.93617021276595%; 
    *width: 48.88297872340425%; 
} 

.row-fluid .span5 { 
    width: 40.42553191489362%; 
    *width: 40.37234042553192%; 
} 

.row-fluid .span4 { 
    width: 31.914893617021278%; 
    *width: 31.861702127659576%; 
} 

.row-fluid .span3 { 
    width: 23.404255319148934%; 
    *width: 23.351063829787233%; 
} 

.row-fluid .span2 { 
    width: 14.893617021276595%; 
    *width: 14.840425531914894%; 
} 

.row-fluid .span1 { 
    width: 6.382978723404255%; 
    *width: 6.329787234042553%; 
}

来源

2013-07-10 07:32:00 Vishwanath

引导列宽度问题

回答

相关问题