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

コードでは行流体を使用しているため、通常、ブートストラップを組み合わせたcssを使用するか、ブートストラップレスポンシブcssを含める必要があります。

また、同じ行に複数のグリッド入力を含める場合のフォームでは<div class="controls controls-row">、パディングをすべて正しく機能させるために、それらをワープインする必要があります。

私のテストでは、特定の画面幅で奇妙なレイアウトのブリップに気づきました。私にとって、非流動的な行を使用すると、フォームに対して最も一貫した結果が得られます。

http://jsfiddle.net/panchroma/zhsks/を参照してください。これはすべて機能します（非流体行）

コントロールの詳細については、http：//twitter.github.com/bootstrap/base-css.html#formsを参照してください-row div

幸運を！

于 2013-01-23T14:23:08.340 に答える