HTML change the line of the checkbox automatically

This is how the website look.

In the first line of the checkbox, the last checkbox and its label isn't connected together, how am I going to put the checkbox and its label in the same line.

This is the css of the checkbox

.checkboxContainer {
    display: inline-block;
    padding-top: 80px;
    padding-left: 40px;
    padding-right: 30px;
    padding-inline: 50px;
}

.checkboxContainer label {
    font-size: 25px;
    padding-right: 10px;
}

The way I created the checkbox (I have shortened the data)

const checkboxContainer=document.querySelector(".checkboxContainer");

let nutritions=[{"id":1,"label":"食品分類"},...];
for (let tmp of nutritions) {
    const checkboxId="checkbox"+tmp.id;
    const checkbox='<input type="checkbox" id="'+checkboxId+'" class="checkbox-input">';
    const label='<label for"'+checkboxId+'">'+tmp.label+'</label>';
    checkboxContainer.innerHTML+=checkbox+label;
}