simple_form date input not showing in same line

Question

i have an input date in my form:

<%= simple_form_for @user, url:wizard_path, html: {class: 'form-horizontal'}, wrapper: :horizontal_input_group do |f| %>
    <%= f.simple_fields_for :educations do |b| %>
    <%= b.input :school_name %>
    <%= b.input :degree %>
    <%= b.input :year_started %>
    <%= b.input :year_finished %>
    <% end %>
    <%= f.button :submit, "Continue" %>
    or<%= link_to " Skip this step", next_wizard_path%>
    <% end %>

My problem is that the day month and year inputs are not in the same line and it looks ugly (ie it shows 3 lines, one input per line). I thought that the default behaviour of simple_form will show the date input in the same line, but mine is not. Is this normal in simple_form? (for date input specifically) or do I need to do some configurations via css? Please help me :(

RELEVANT MODELS:

User model:

has_many :educations, dependent: :destroy
accepts_nested_attributes_for :educations

Education model:

belongs_to :user

Hi, Thanks for the reply, I included the models, please see my edit. — jumbo_hotdog
I have tried this in css, it works ok but its not the right solution for my problem, the problem is i have this model nested, so I have a dynamic form here to add attributes, (Im followng railcast 196). I need a way to manipulate the input size of date correctly but I dont know how to fix it — jumbo_hotdog
I should have asked for the schema too. It was 4AM, so that's my excuse and I'm sticking to it. Grin. Anyway, please post it. If you can add a screen clip of the problem, too, that wouldn't hurt. — Richard_G
thanks agiain for the reply, I think I have solved my problem, see my answer. My problem now is i want to set margin-right: to 0 of the last element of select.. If you know how please tell me. thanks — jumbo_hotdog

jumbo_hotdog jumbo_hotdog · Accepted Answer · 2015-02-28T13:33:15

After looking around, I found an answer to my problem here

I was hoping to solve this without using css because I thought simple_form has a way of handling this kind of things.

HTML:

<select id="user_educations_attributes_0_year_started_3i" name="user[educations_attributes][0][year_started(3i)]" class="date required form-control">

<select id="user_educations_attributes_0_year_started_2i" name="user[educations_attributes][0][year_started(2i)]" class="date required form-control">

<select id="user_educations_attributes_0_year_started_1i" name="user[educations_attributes][0][year_started(1i)]" class="date required form-control">

CSS:

.date.required.form-control{ 
display: inline-block;
width: 32%;
margin-right: 5px;
}

simple_form date input not showing in same line

1 Answers