I am looking to create a new line after the last input of my form. On this new line, I want to add a "remove-link".
This is my HTML:
<div class="subform dynamic-form">
<label for="id_delivery_set-0-price">
Price:
</label>
<input id="id_delivery_set-0-price" type="number" step="0.01" name="delivery_set-0-price"></input>
<label for="id_delivery_set-0-amount">
Amount:
</label>
<input id="id_delivery_set-0-amount" type="number" name="delivery_set-0-amount" min="0"></input>
<label for="id_delivery_set-0-humidity" style="display: none;">
Humidity:
</label>
<input id="id_delivery_set-0-humidity" type="number" name="delivery_set-0-humidity" style="display: none;"></input>
<label for="id_delivery_set-0-weight" style="display: none;">
Weight:
</label>
<input id="id_delivery_set-0-weight" type="number" step="0.01" name="delivery_set-0-weight" style="display: none;"></input>
<input id="id_delivery_set-0-DELETE" type="hidden" name="delivery_set-0-DELETE"></input>
<input id="id_delivery_set-0-bill" type="hidden" name="delivery_set-0-bill"></input>
<input id="id_delivery_set-0-id" type="hidden" name="delivery_set-0-id"></input>
<a class="btn del btn-danger" href="javascript:void(0)">
remove
</a>
Picture:
I would like the "remove-link" below the "amount-input-field". How can I achieve this with CSS?
.subform {
display: inline-block;
}
.del {
????
}
A solution using jQuery is also acceptable.