我的常用表单布局写法

可能大家也看过很多关于用户体验的文章说，我们的表单应该是这样排列好些

不过迫于空间紧张或者其他因素，我们依然可以看到这样的设计

第一种自然不必说，针对第二种设计，你的写法是怎样的呢？ 目前我看到大部分的表单布局还是用一个宽度一致容器包含左侧的提示，右侧再用一个容器包含用户操作内容，用浮动或者inline-block对齐。 以下是我的常用写法，这样的布局方式可能我们常见于带有图片的混合列表，我觉得用于表单也是非常方便的。

<div class="login">
        <p class="class">
                <label for="">姓：</label>
                <input type="text" />
        </p>
        <p class="class">
                <label for="">名字：</label>
                <input type="text" />
        </p>
        <p class="class">
                <label for="">你的电子邮件：</label>
                <input type="text" />
        </p>
        <p class="class">
                <label for="">再次输入电子邮件地址：</label>
                <input type="text" />
        </p>
        ……
        ……
</div>
<style type="text/css">
        .login p{padding-left:130px;}
        .login p label{position:absolute;width:130px;margin-left:-130px;text-align:right;}
</style>