Formatting checkboxes in django - css

Question

i'm trying to add some checkboxes into my form and to make them look nice. The thing is that when I use {{form.checkBoxFilter}} the output is like:
I would like to have them inline and readable, unfortunately using crispy forms renders them too close to each other.
I found that looping through elements will place them inline but still they're close to each other (their labels are much longer than shown below).
{% for x in filter.weights%} {{x}} {%endfor%}
Where to put my css in this case?
filters.py:
weights = django_filters.MultipleChoiceFilter(
label = "Filter by weight",
required=False,
widget=forms.CheckboxSelectMultiple,
choices=OZ,
method = 'filter_by_checkbox'
)
Adding directly into static/css won't work :
input[type=checkbox]
{
padding: 20px;
margin: 20px 15px 0px 3px;
}

Answer 1

You could use css to seperate them. For example you could use a bootstrap stylesheet in your base.html (read here).
when installed you could do it like this:
<div class="container">
<div class="row mb-1">
{% for x in filter.weights %}
<div class="col-sm-XX">
{{x}}
</div>
{%endfor%}
</div>
</div>
where XX should be a suitable size. Keep in mind bootstrap divedes the page in 12 parts. Also it comes with some css features.
Update for your edit:
assign a class to your checkbox and go for the class in the css. You can also use the built in x.as_p to display it as <p> element.