9

Rails アプリケーションで、Zurb Foundation と共に Simple_Form を使用しています。

1 つ以上のビューに、次の date_select を持つフォームがあります

フォーム フィールドがインラインではなく積み上げて表示されます。すべてを確認しましたが、これらを正しく表示する方法がわかりません。

私は何が欠けていますか？https://github.com/stanrails/momtomom の event.html.erb ビューでレポを確認できます。

セクションのコードは次のとおりです。

    <div class="row">
        <div class="small-5 columns">
            <%= f.date_select :eventDate %>
        </div>
    </div>
4

3 に答える 3

4

回避策の 1 つは、次のように手動で行うことです。

form.custom .dropdown.date{
  width: 30%;
  margin-right: 10px;
  float: left;
}
于 2013-09-29T05:46:28.627 に答える
2

これは、私が共有したかった別の見方であり、最終的には次のようになります。

ここに画像の説明を入力

ちょっとhtml！

  div[class="row"]
    div[class="large-12 columns select-date-wrapper"]
      = f.date_select(:birthdate,
          options = { start_year: DateTime.now.year - 18, end_year: DateTime.now.year - 75, order: [:month, :day, :year], include_blank: true},
          html_options = { class: 'select-date'})

少しサス！

select.select-date {
  width: 30%;
  margin-right: 10px;
  float: left;
}
.select-date-wrapper{
  select:first-of-type{
    width: 45%;
  }
  select:nth-of-type(2){
    width: 20%;
  }
  select:last-of-type{
    margin-right: 0;
  }
}
于 2014-10-08T07:03:33.013 に答える
0

HTMLを確認し、関連するタグのcssを変更することで、同じ問題を解決しました。

<%= f.date_select :date %>生成:

<div class="field col-md-6">
    <select id="invoice_date_1i" name="invoice[date(1i)]">
    <select id="invoice_date_2i" name="invoice[date(2i)]">
    <select id="invoice_date_3i" name="invoice[date(3i)]">
</div>

ここでのモデル名は「Invoice」です。したがって、CSSに追加できます

#yourModel_date_1i, #yourmodel_date_2i, #yourmodel_date_3i { width: 30%; }

簡単に修正できます。

于 2015-08-23T11:34:52.920 に答える