2017-03-19 15 views
-1

こんにちは、チュートリアル(ここでは合計noob)を見た後に練習するためのタスク管理アプリケーションで作業していましたが、私はブーストラップでそれをスタイリングするとき、条件がテーブルの中にあるときに内部が整列しない、2番目のテーブルがすべて取り除かれてしまう。rails条件付きミスアライメントブーラップテーブル

は、ここに私のコードです:https://www.dropbox.com/s/lgvwxc0u19r0gcl/Screenshot%202017-03-18%2022.44.32.png?dl=0

は、ここで(アイテムが揃えされていないかを確認)やっているものです:https://www.dropbox.com/s/x7n6tn4l5teah5l/Screenshot%202017-03-18%2022.45.16.png?dl=0

私は彼らに、彼らのそれぞれのクラスを与えて試してみた自分のしていると、それを揃えるしようとしていますCSSではそれは何もしていないようです。

なぜこれが起こっているのか、解決策は何か? Rails 4.2.5とbootstrap-sass gem

ご協力いただきありがとうございます。

+0

なぜtdにwidth属性を1つの条件に入れますか? –

+0

@rails_id私の悪い...それを取ることを忘れてしまった、私はテーブルが何をしていたかを視覚化するために1pxの赤い境界線の属性を追加し、私はそれに固定幅を設定しようとしていた、私はすでに離陸したスクリーンショット。 – megaloopy

答えて

0

私はブートストラップからPanelsを見ます。テーブルを扱うことなく素敵なレイアウトを設定することができます。

<div class="panel panel-default"> 
    <div class="panel-heading"> 
    <h3 class="panel-title">Panel title</h3> 
    </div> 
    <div class="panel-body"> 
    Edit | Delete 
    </div> 
    <ul class="list-group"> 
    <li class="list-group-item"> 
     <div class="row"> 
     <div class="col-lg-2">check</div> 
     <div class="col-lg-7">name</div> 
     <div class="col-lg-3">delete</div> 
     </div> 
    </li> 
    </ul> 
</div> 

コードに貼り付けることができる場合は、シナリオに関連する例を表示できます。

+0

Tnxたくさんのマイケル私はもう少し詳しく実験しています。このコードは実際には部分的ですが、問題のコードが本体の内部にレンダリングされているshow.html.erbページのパネルを使用していますパネル。私のコードをパネルの部分的な内部に入れて試してみてください。 – megaloopy