将div定位在另一个div内

Question

我正在为我的网站创建登录表单，但布局应该与标准图像匹配。我正在为该图片开发一份副本。我有一个div（position: absolute），它是主面板，我内部有一些div标签。我想根据下图正确定位“保持登录状态”文本。该文本应垂直对齐复选框的中间位置。这是我的布局：

http://jsfiddle.net/nisa_sala/uA99f/

这是我的目标布局：

这是我失败的布局：

HTML

<div id="apDiv27">
    <div class="bot_con" id="bc1"><label id="lab_1">Email or Phone:</label>
      <input type="text" name="textfield4" id="textfield4" />
</div>
    <div class="bot_con" id="bc2"><label id="lab_2">Password:</label>
      <input type="text" name="textfield5" id="textfield5" />
    </div>
    <div class="bot_con" id="bc3">

        <input type="checkbox" name="checkbox2" id="checkbox2" />
      <label id="lab_3">Keep me logged in  </label>
    </div>
    <div class="bot_con" id="bc4"><a href="http://people-analize.herokuapp.com" target="_blank" tabindex="-1">Forgot your password?</a></div>
  </div>

我上传了我的2张图片。如何将此文本相对于复选框垂直放置在中间位置？

Answer 1

  

...该文本应该相对于复选框垂直居中...

vertical-align: middle正是您要找的。

更新了小提琴： http://jsfiddle.net/abhitalks/uA99f/1/

CSS：

input, label {
    vertical-align: middle;
}

Answer 2

添加label{ vertical-align: middle}并将line-height: 1.28;上的#apDiv27 #bc3更改为line-height: 1.9;