Why django forms shows input in row instead of a column

I wonder why django modelForm shows input in a row instead of a column like this:

image

I like all input in my model to be in a column when putting {{ form|crispy}} in the template, as you can see in the template, even if add col-md-3 to resize the input in a col it does not work, I think there is something I need to know about django-forms.

template:

--- Bootstrap-5

<div class="container">
        <div class="row justify-content-center">
            <div class="col-md-3">
                <form method="post" enctype="multipart/form-data">
                    {% csrf_token %}
                    {{ form|crispy}} 
                    <button type="submit" class="btn btn-primary">Create Student</button>
                </form>
            </div>
        </div>
    </div>

The Result:

Image

My Forms.py file:

class PrimaryForms(forms.ModelForm):
    signature_of_student = JSignatureField(
        widget=JSignatureWidget(
            jsignature_attrs={'color':'#e0b642', 'height':'200px'}
            )
            )
    
    signature_of_guardian = JSignatureField(
        widget=JSignatureWidget(
            jsignature_attrs={'color':'#e0b642', 'height':'200px'}
            )
            )
    date_of_birth = forms.DateField(widget=forms.DateInput(attrs={'type': 'date'}))

    class Meta:
        model = Primary
        fields = ['admission_number', 'profile_picture', 'first_name', 
        'last_name', 'gender', 'address_of_student', 'class_Of_student', 
        'comment_of_student', 'year_of_graduation', 'date_of_birth', 'religion', 'mother_name',]

How can I make my input to be in column?

If you want all fields in full row, you need to change col-md-12 in html

--- Bootstrap-5

<div class="container">
        <div class="row justify-content-center">
            <div class="col-lg-3 col-md-12">
                <form method="post" enctype="multipart/form-data">
                    {% csrf_token %}
                    {{ form|crispy}} 
                    <button type="submit" class="btn btn-primary">Create Student</button>
                </form>
            </div>
        </div>
    </div>
Back to Top