問題タブ [grid-system]

私の Web ページにはテーブルがあり、1 つの要素に対して、基盤のグリッド プロパティを適用する必要があります。行をサイズ 10 と 2 の 2 つの列に分割する必要があります。最初の列は入力フィールドで、2 番目の列はドロップダウン アイコンですが、それを実行しようとすると、2 番目の列が最初の列の後に下がります。

http://codepen.io/anon/pen/MaaOxG

私は奇妙な問題を抱えています.3つのタブメニュー項目があり、テキストがあり、テキストがborder-bottomを設定した後、最初のメニュータブでは正常に機能しますが、他の2つは別のborder-bottomの上に表示されますが、コードを Jsfiddle に入れると正しく動作します..これが私のコードJsfiddle です

HTML

CSS

最初は画面の境界が正しい場所にある

2 番目のタブでは、この同じ境界線が別のタブの上に表示されます

コメントを表示するための非常に単純な HTML 構造を実装しようとしています。アバターはコメント テキストの左側に次のように表示されます。

Susy を使用してレイアウトを作成しています。

私の問題：コメントを互いにスペースを空けたいので、設定しました

しかし、それは効果的ではありません: マージンが尊重されることもありますが、コメントテキストが長い場合、マージンは尊重されません ( http://codepen.io/anon/pen/QjrrqP、ラテンテキストとコメントテキスト 2 の間を参照)。

どんなアドバイスもとても役に立ちます！

私はこのレイアウトが必要です（写真を参照）、私はたくさん試しましたが、何もうまくいきません..ここに私のコードがあります：

Material-UIで少し遊んでいます。グリッド レイアウトを作成するためのオプションはありますか ( Bootstrapなど)?

そうでない場合、この機能を追加する方法は何ですか?

GridList コンポーネントがありますが、それには別の目的があると思います。

ブートストラップ列を自動調整したいのですが、「自動調整」とは、表示する要素の数に応じてグリッドを動的に作成することです。次の html があります。

私は角度ディレクティブと ng-repeat を使用して html を生成しています。これがディレクティブです。

ご覧のとおり、col-md-43 つの要素のみが 1 行に収まることを意味するクラスがあります。私が望むのは、要素がいくつあっても (それらは常に 2 から 5 の間です)、要素が 1 行に収まることです。 、2 つまたは 5 つの場合は 1 つの行に収まる必要があり、4 つの要素の場合はクラス<a>、col-md-32 つの要素の場合はクラス、などです。<a>col-md-6

私はAngularJSを使用しているので、角度のある方法でそれを行う方法はありますか? 異なる Ctrl を持ついくつかのビューで使用するので、可能であればコードを DRY に保ちます。

私はしばらくの間、この問題を解決しようとしてきました... 私は現在 Web 開発を学んでおり、ブートストラップ グリッド システムの実装は演習の 1 つです。多くのリソースを見ましたが、まだ答えが見つかりません。

問題は、すべてが正常に機能しているように見えることです。S と XS の間を除くすべての画面サイズで。なぜかレイアウトが崩れる。スマホで見ても同じです。その時の様子をスクショ撮ってみました。

誰かが私を助けてくれたらいいのに...ありがとう