djangoformattingdjango-formsstylingdjango-comments

How to format form fields for django comments?


I am using a form which is generated for me by django. I'm using this as a comment form after a post in my blog.

Currently it renders fine but it's not nicely aligned. This is what I have. alt text This is what I'd like. alt text

Thanks

edit: This is the result when I user {{ form.as_table }}

alt text


Solution

  • Posting my solution hoping it'll help someone else oneday. I knew that you'd style the fields with css but wasn't sure how to assign the classes to each item. But if you take a look at the default template provided you'll notice that the error class is assigned to a field using an if statement within a foreach loop that automatically generates each field within your form. i.e.

    {% for field in form %}    
    < p{% if field.errors %} 
        class="error"
    {% endif %}
        {{ field.label_tag }}<'/' p> 
    {% endfor %}
    

    So I added onto this functionality.

    < p{% if field.errors %} 
        class="error"
    {% endif %}
    {% ifequal field.name "honeypot" %} 
        id="hide"
    {% else %}
         id="left"
    {% endifequal %}>
        {{ field.label_tag }}<'/' p> 
    

    my css being

    #hide{
        display:none;
    
    }
    
    #left{
        width: 200px;
        text-align: left;
    
    }
    
    #right{
        width: 300px;
        text-align: left;
    
    }
    

    Now that you can set your classes you can easily setup your classes or id within your css file. This is for the comments. If you're using a {{ form.as_p }} or {{ form.as_table }} to generate your form then you just set a general form class within your css to style it. i.e.

    form {
    width: 350px;
    padding: 20px;
    border: 1px solid #270644;
    }