can't change the height of a text field in simple_form

ぃ、小莉子 提交于 2019-12-21 07:23:58

问题


I've tried

  #Default size for text inputs.  
  config.default_input_size = 10

from config/initializers/simple_form.rb

I've also tried <%= f.input :message, :input_html => {:size => 10} %>

But neither of these change a single thing about how my text fields appear.


回答1:


You need to do this

<%= f.input :message, :input_html => {:rows => 10} %>

Html text area tag attributes has two attributes namely rows and cols which lets you specify the no of rows and columns(i.e. width) of your text area. If this is not working then open the console and see if your css is overriding the height.




回答2:


Passing :input_html options override default values. You must check attributes values for css classes that can modify their behavior.

<%= f.input : message, :as => :text, :input_html => { 'rows' => 10} %>



回答3:


I managed to do this by adding :as => :text to the input field attributes and then adding style & rows to the input html:

<%= f.input :message, label: "Message: ", :as => :text, input_html: { :style=> 'width: 100%;', :rows => 4} %>

For me it was the :as => :text that got the "rows" attribute to work, and the 100% width made it fluid rather than fixed-width.




回答4:


if you want to change "height", you need to modify css attribute:

<%= f.input :message, input_html: {style: 'height:10px;'} %>



回答5:


Old question, I know. This is what worked for me with SimpleForm 3.2.0 and Rails 4.2.3:

<%= f.input_field :field_name, as: :text, class: "my-custom-class", rows: 5 %>



回答6:


You can do

<%= f.input :message, :size => "10x10" %>

for height and width.

It might work for text field but definitely works for text_area. You probably would want to use text_area for a message anyway.




回答7:


Try Firebug or Code Inspector from Google Chrome to inspect the text_field element, see the exactly class name and change it directly in your stylesheet file.




回答8:


I just had the same issue on Rails 5.1 and Bootstrap4. I did the following:

<%= f.input :bio, input_html: {style: 'height:200px !important;'} %>

and it works.



来源:https://stackoverflow.com/questions/13556522/cant-change-the-height-of-a-text-field-in-simple-form

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!