0
私の質問への回答や以前の投稿は見つかりませんでした。ブートストラップ - 入力がグリッドサイズ/制限を尊重しない
私は仕事のために内部目的で仕事をしており、家で働くことを試みているだけです。間違ったことやバグがあるかどうか、別のJS UIを使用しているかどうかはわかりません。
私はUIに必要なものは、タブ、グリッドシステム、フォーム入力です。ブートストラップは私が今までに見つけた最良の選択肢のようです。私は4.0.0.beta2になったので、それは最新です。入力要素、テキスト、数字などを除いてすべてが機能します。私がブートストラップを持つグリッドシステムにこれらを入れると、入力要素はグリッドサイジングを尊重しません。他のすべてのフォーム要素が行います。
ここに私の現在のテストページがあります。入力タイプはグリッドの外側を右に流れます。私は、フォームグループ、さまざまなサイズ、入力タイプ、私が考えることができるかなり多くを動かしてみました。 （編集 - 問題を解決していない、まだ、ちょうどそれがされている必要がありますよう行に詳細行を変更）
<!DOCTYPE html>
<html lang=en>
<head>
<!-- Standard Meta -->
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Site Properties -->
<link rel="stylesheet" href="css/bootstrap.4.0.0.beta2.min.css">
<title> -- </title>
</head>
<body>
<div id="viewport" class="container">
<div class="row">
<div class="col-sm-2">Type</div>
<div class="col-sm-2">Vendor</div>
<div class="col-sm-3">Item</div>
<div class="col-sm-3">Note</div>
<div class="col-sm-1">Min Stock</div>
<div class="col-sm-1">To Order</div>
</div>
<div class="row">
<div class="col-sm-2">Animal</div>
<div class="col-sm-2">Bear</div>
<div class="col-sm-3">Black</div>
<div class="col-sm-3">Midnight</div>
<div class="col-sm-1">0</div>
<div class="col-sm-1">
<input class="input-sm" id="item-87">
</div>
</div>
</div>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/bootstrap.bundle.4.0.0.beta2.min.js"></script>
</body>
</html>
サイドノート： 私は外、コル/行/コルで入力タイプをカプセル化した場合メインのラベルはそれ自身を列の幅に制限します。しかし、それは異なるサイズであるため、他の行との位置がずれてしまいます。私はあなたの入力にブートストラップグリッドクラスを適用する必要があることを信じて
ここに自分のコードを修正しました。私は以前にコードで修正したように見えますが、ここでは修正されていません。フォームコントロールを追加しても何もしませんでした。 –
入力に 'form-control'が追加されたコード：https://www.bootply.com/cUn9Jx5MOA –
ありがとうございます。何らかの理由でこれは自宅で働いていますが、仕事ではありません。意味私はどこか別のものが混乱している。ああ。 –