Как остановить поля формы из смещения в форме Bootstrap

Question

Привет, это используется twitter Bootstrap 2.3.2 У меня есть форма, которая имеет флажок справа от выпадающего списка. Идея состоит в том, что если пользователь нажмет на этот флажок, он скроет раскрывающееся меню и покажет новое поле ввода, чтобы пользователь мог ввести новый заголовок позиции.

При щелчке по галочке он скрывает div с меткой и div, который содержит выпадающее меню. Дива с новой меткой ввода показывает, но следующая строка формы сдвинута.

http://jsfiddle.net/mwoods98/sdcs3gka/3/

Еще одна странность в том, что у меня есть второй скрытый набор Div для .hide(), но она по-прежнему в силу во время загрузки, но при загрузке страницы, вы можете увидеть его на долю секунды.

      $(function() { 
          $('#NewPositionDiv').hide(); 
          $('#NewlabelPosTitle').hide(); 
          $('#fcbNewPos').change(function() { 
           if ($('#fcbNewPos').is(':checked')) { 
            $('#PositionDiv').hide(); 
            $('#labelPosTitle').hide(); 
            $('#NewPositionDiv').show(); 
            $('#NewlabelPosTitle').show(); 
            $('#NewPositionName').focus(); 
           } else { 
            $('#PositionDiv').show(); 
            $('#NewPositionDiv').hide(); 
            $('#NewlabelPosTitle').hide(); 
           } 
            }).change(); 
           }); 

Это код JS, который скрывает div.

Заранее благодарен!

Answer 1

Хорошо, я добавил clearfix в класс управления заменой DIV, похоже, делает исправление.