Vertical alignment of text in Django form widget

Question

I have a multi-line input field in my form. The text is aligned in the middle, but I want it aligned to the top.

My form:

class FeedbackForm(forms.ModelForm):
    submitter = forms.CharField(max_length=100, help_text="Name")
    sub_email = forms.EmailField(help_text="E-Mail Adresse (wird nicht veröffentlicht.)")
    sub_date = forms.DateField(disabled=True, help_text="Datum", initial=date.today())
    content = forms.CharField(max_length=500, help_text="Text",
        widget=forms.TextInput(attrs={'vertical-align': 'top'}))

My template:

<form id="category_form" method="POST"> 
    {% csrf_token %}
    {% for hidden in form.hidden_fields %}
        {{ hidden }}
    {% endfor %}
    <table>
       <tr>
           <td><strong>Datum</strong></td>
           <td>{{ form.sub_date }}{{ form.sub_date.errors }}</td>
        </tr>
       <tr>
           <td><strong>Name</strong></td>
           <td>{{ form.submitter }}{{ form.submitter.errors }}</td>
        </tr>
       <tr>
           <td><strong>E-Mail</strong></td>
           <td>{{ form.sub_email }}{{ form.sub_email.errors }}</td>
        </tr>
       <tr>
           <td><strong>Text</strong></td>
           <td>{{ form.content }}{{ form.content.errors }}</td>
        </tr>
    </table>

    <p><input type="submit" name="submit" value="Save" /></p>
</form>

I'm trying to pass the CSS style in the attrs attribute of the widget, as described in the Django docs. But my text is still aligned in the middle. What am I doing wrong?

Answer 1

Figured it out.

What you do is use the Textarea widget instad of TextInput:

content = forms.CharField(max_length=500, help_text="Text",
        widget=forms.Textarea()

Then you can apply the style in the CSS:

textarea, input, button, select { 
    font-family: inherit; font-size: inherit; 
}