0

我已经从我的页面中删除了所有内容，只是一个指向新引导文件的链接。尽管如此，即使我的跨度加起来为 12，它们在 Firefox 和 chrome 中都显示不同的宽度。世界上可能出了什么问题？

<!DOCTYPE html>
<html lang="en">
<head>

    <link href="css/bootstrap.css" type="text/css" rel="stylesheet">

</head>
<body>
    <div class="row-fluid">
        <input type="text" class="span6" placeholder="Pre">
        <input type="text" class="span6" placeholder="Pre">
    </div>  
    <div class="row-fluid">
        <input type="text" class="span6" placeholder="Pre">
        <input type="text" class="span4" placeholder="First Name">
        <input type="text" class="span2" placeholder="Sufix">
    </div>
    <div class="row-fluid">
        <input type="text" class="span4" placeholder="Pre">
        <input type="text" class="span4" placeholder="First Name">
        <input type="text" class="span4" placeholder="Last Name">
    </div>
    <div class="row-fluid">
        <input type="text" class="span2" placeholder="Pre">
        <input type="text" class="span4" placeholder="First Name">
        <input type="text" class="span4" placeholder="Last Name">
        <input type="text" class="span2" placeholder="Sufix">
    </div>
    <div class="row-fluid">
        <input type="text" class="span6" placeholder="Pre">
        <input type="text" class="span6" placeholder="First Name">
    </div>
</body>

4

1 回答 1

0

在您的代码中，您使用的是 row-fluid，因此您通常需要使用引导组合 css 或包含引导响应 css。

此外，当在同一行上包含多个网格输入时，您还需要将它们变形<div class="controls controls-row">以使填充正常工作。

在我的测试中，我仍然注意到某些屏幕宽度处的奇怪布局亮点。对我来说，当使用非流动行时，我会为您的表单获得最一致的结果。

请参阅http://jsfiddle.net/panchroma/zhsks/这一切都为您工作（非流体行）

有关控件行 div 的更多详细信息，请参阅http://twitter.github.com/bootstrap/base-css.html#forms

祝你好运！

于 2013-01-23T14:23:08.340 回答