ineedahero ineedahero - 3 months ago 11
HTML Question

RAILS: Use different-sized text areas within a single form

I have a form where different fields require differently sized text areas. I want something like this:

CSS File

textarea1 {
width: 170px;
height: 45px;

max-width: 100%;
max-height: 90px;
min-width: 170px;
min-height: 45px;
}

textarea2 {
width: 220px;
height: 70px;

max-width: 100%;
max-height: 110px;
min-width: 220px;
min-height: 70px;
}


And then in the HTML:

<%= f.label :smaller_entry, 'Smaller Entry' %>
<%= f.text_area1 :smaller %>

<%= f.label :bigger_entry, 'Bigger Entry' %>
<%= f.text_area2 :bigger %>


Of course, "text_area" is a keyword member of my "form" object, so I couldn't add the "1" and "2" at the end.

Answer

You should use the css classes:

.textarea1 {
    width: 170px;
    height: 45px;

    max-width: 100%;
    max-height: 90px;
    min-width: 170px;
    min-height: 45px;
}
.textarea2 {
    width: 220px;
    height: 70px;

    max-width: 100%;
    max-height: 110px;
    min-width: 220px;
    min-height: 70px;
}

and

<%= f.label :smaller_entry, 'Smaller Entry' %>
<%= f.text_area :smaller, class: 'text_area1' %>

<%= f.label :bigger_entry, 'Bigger Entry' %>
<%= f.text_area :bigger, class: 'text_area2'%>