html - Bootstrap 3 checkbox center alignment and float: none seems to be ignored in IE -
first of here bootply sandbox: demo of issue. rendered expected in chrome , ff, float: none seems ignored in ie.
steps:
the thing i've added basic starter bootply template following markup:
<div class="checkbox"> <input id="mycheckbox" style="float: none;" type="checkbox"> <label for="mycheckbox">my checkbox</label> </div> this div inside , original <div class="text-center"> text and checkbox horizontally center aligned... if apply float: none input element.
the problem in ie (all versions including 11) float: none seems ignored, checkbox still aligned left, way far label. issue detected in pretty complex page used kendo, bootstrap, custom bootstrap theme (inspinia) + custom styles, i've succeded isolate in simple bootstrap demo.
in pictures:
correct rendering in chrome , ff:

very same markup incorrect rendering in ie 11:

missed something? have checkbox center aligned. margins not option, because page should responsive, , container resized.
i not sure why works in chrome , ff , not in ie, , browser "right" (probably not ie i'm guessing...), problem in ie position: absolute checkbox gets boostrap css. if add position: relative checkbox in addition float: none rendered expected in ie well.
Comments
Post a Comment