wrapper div pushes out label hence causing it to appear at the bottom

[kemalemin]

As seen above, the label is pushed after the div element hence it appears at the bottom. I've disabled all other css files thinking they might be the cause but had no luck.

Is this a bug?

[drgullin]

Customized inputs are block-level elements (display: block;) by default.

You may use display: inline-block; instead, so the labels won't be automatically placed on a new lines.

Example:

.icheckbox_square-red {
   display: inline-block;
   vertical-align: middle;   

   // Additional CSS for <IE8
   *display: inline;
   *zoom: 1;
}

You can also use floats or absolute: position;.

http://www.impressivewebs.com/difference-block-inline-css/