simple_form 'form-inline' not working

Question

I'm trying to make two input (firstname and lastname) to next to each other.

Here is my code and it's currently just showing two big rows of input window.

= simple_form_for @user, html: {class: 'form-inline'} do |f|
  = f.fields_for :profile, @user.profile || Profile.new, html: {class: 'form-inline'}  do |p|
     .form-1
        .form-1-detail
           .input-text
              = f.input :last_name, required: true
           .input-text
               = f.input :first_name, required: true

I'm now sure how to make them to display inline. Can anyone help me?

Thanks!

Updated. This is the actual HTML generate from

= simple_form_for @user, html: {class: 'form-inline'} do |f|
 = f.fields_for :profile, @user.profile || Profile.new do |p| # removed form-inline here
  .form-1
    .form-1-detail
      .form-group
        = f.input :last_name, required: true
      .form-group
        = f.input :first_name, required: true




</div><form class="simple_form form-inline" novalidate="novalidate" id="new_user" action="/users" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="DhQSodBk8kxdE6q9uPJDKSs9FfxCNLyXFYT3bZ42HlZfHefxfG3BDq9qkFpxkX7MBZI4Mc4Wje6LKw7Gp1YcjQ==" />
  <div class="form-1">
    <div class="form-1-detail">
      <div class="form-group">
        <div class="input string required user_last_name"><label class="string required" for="user_last_name"><abbr title="required">*</abbr> 姓</label><input class="string required" placeholder="姓" type="text" name="user[last_name]" id="user_last_name" /></div>
      </div>
      <div class="form-group">
        <div class="input string required user_first_name"><label class="string required" for="user_first_name"><abbr title="required">*</abbr> 名</label><input class="string required" placeholder="名" type="text" name="user[first_name]" id="user_first_name" /></div>
      </div>
    </div>
  </div></form>

Answer 1

You should install the simple_form wrappers:

rails generate simple_form:install --bootstrap

From there you can structure a inline_form using it's corresponding wrapper:

simple_form_for @user, wrapper: :inline_form, html: { class: 'form-inline' } ...

They have an example app: https://github.com/rafaelfranca/simple_form-bootstrap

The specific view that using this is (sorry it's ERB however):

https://github.com/rafaelfranca/simple_form-bootstrap/blob/master/app/views/examples/_inline_form_sf.html.erb