I would like to display two form fields on the same line and not each one after the other one.

For the moment, I get:

Choice a theme :. Datasystems. Cameroun

But I would like to display this form like:

Choice a theme:. Datasystems                    . Cameroun

My .html file looks like :

{% extends 'Base_Configurations.html' %} 
{% load staticfiles %} 
{% load static %} 
{% block title %}<h3> <span class="glyphicon glyphicon-file"></span> Choix du thème DatasystemsEC </align> </h3>
{% endblock %}{% block content %}<form class="form" method='POST' action=''> {% csrf_token %}<br></br>{{ form }}<br></br><input class="button" type="submit" value="Valider le thème" /></form>{% endblock %}

I have also a .css file :

.form-fields {border-radius: 4px;margin-right: auto;width:50%;background-color: #f5f5f5;}.form {padding-left:8vw;}label {width: 35%;border-radius: 8px; margin-bottom: -20px;list-style: none;
}

For the moment, I don't find a way to solve my problem. I looked some tutorials or StackOverflow questions but nothing up to now.

Do you have any idea about this handling?

You can do this by Bootstrap grid system. As suggested in the question, By this there will be two fields on each row.

Try this:

  <div class="container"><div class="row">{% for field in form  %}<div class="col-sm-6"><b>{{ field.label_tag }}</b> - {{ field }} </div>{% endfor %}</div>  </div>