想象一个由两行两列组成的简单形式：
标题..............密码
名字....重复密码
如果每个“行”都包含在 div class =“row”中，则出现在“密码”下的验证消息会正确向下移动第二行中的两个字段 - “名字”和“重复”密码'。一切都整齐排列，太棒了！但是，如果我将屏幕缩小到移动设备的大小，则会创建错误排序的单列：
标题
密码
名字
重复密码
代替：
标题
名字
密码
重复密码
但是，如果我改为有一行并将“标题”和“名字”列表格组放在一个 div class =＆＃34; col-md-6＆＃34; 中，在第二个 div class =＆＃34; col-md-6＆＃34; 中的'密码'和'重复密码'，我在一个小屏幕上得到正确排序的单列 - 这是很好，但验证消息会将行单元格从大屏幕上的垂直对齐中敲出来，即
标题..............密码
名字......（必填）
....................重复密码。
有关如何获得正确对齐和明智响应的任何想法？我已经加入了一个插图来说明。 （全屏查看。）
http://plnkr.co/edit/MKiS8MMfnivtb8ZTqmuZ?p=preview
非常感谢...
<HTML>