How do you create a hidden div that doesn't create a line break or horizontal space?

Use display:none;

<div id="divCheckbox" style="display: none;">

• visibility: hidden hides the element, but it still takes up space in the layout.

• display: none removes the element completely from the document, it doesn't take up any space.

Since the release of HTML5 one can now simply do:

<div hidden>This div is hidden</div>

Note: This is not supported by some old browsers, most notably IE < 11.

Hidden Attribute Documentation (MDN,W3C)

Use style="display: none;". Also, you probably don't need to have the DIV, just setting the style to display: none on the checkbox would probably be sufficient.