Input SImple form as float add float class

Question

I can’t understand what the purpose of mentioning the float class is for hosting HTML code. The problem faced by this feature of the rail is this: the next element appears next to it, and not immediately after it. Is there an easy way to fix this, instead of using jQuery or more, write inpput to display it as integer / string. To remove this class float .. Please reply ASAP .. :as=>:float must be changed to :as=>:string Thank you ..

  <%= f.association :resource, :required=>:true, %> <%= f.input :join_date,:as=>:string, :required=>:true, :input_html=>{:class=>'datepicker'} %> <%= f.association :resource_role, :required=>:true, :label=>"Role" %> <%= f.association :resource_billing_type, :required=>:true, :label=>"Billing Type" %> <%= f.input :billing_rate, :as=>:float, :required=>:true, %> 

Answer 1

I agree with others that viewing the html output and css code will make it easier to answer this question. I assume you have CSS saying "float: left;" and that after that, and before the save and cancel button, you just need to add a div with "clear: both;" like CSS. Then the submit and cancel buttons will be lower.

It is also possible that you can remove the float and just use relative positioning for the billing speed.

Answer 2

:as=>:float has nothing to do with css, it is used to indicate that the input type will be a floating point number (this is so that a simple form can perform some checks on user input).

What you need to look at is a simple default tag that puts your css elements, which by default is a div. Thus, the problem can be fixed using CSS or by changing it to a paragraph tag with:

SimpleForm.wrapper_tag = :p

If you need a quick hack to fix this, I would suggest that you can just insert the html line break tag.

Answer 3

You can do something like:

 input[type="text"] { clear: right; } 

Make sure that nothing on the right side of the input elements floats with type text.

Answer 4

Using float in forms is pretty common.

Usually your button has a left edge equal to the width of the labels.

I assume your labels + input fields are inside li or div blocks.

I assume that your submit button should also be inside li or div , and this is missing.