css - 联系表格将标签+输入右对齐

Question

我在对齐联系人表单中的标签和输入时遇到问题。由于希伯来语，需要右对齐。 这是我的代码的 fiddle ，它不起作用，你可以看到输入框没有对齐。 无论标签名称的长度是多少，都需要对齐，所有输入框都需要大小相同。链接在这里http://jsfiddle.net/dw4eqn91/

<form action="/contact-us/#wpcf7-f174-p7-o1" method="post" id="newFORM_1">
<div id="newDIV_2">
    <input type="hidden" name="_wpcf7" value="174" id="newINPUT_3" />
    <input type="hidden" name="_wpcf7_version" value="4.2.2" id="newINPUT_4" />
    <input type="hidden" name="_wpcf7_locale" value="en_US" id="newINPUT_5" />
    <input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f174-p7-o1" id="newINPUT_6" />
    <input type="hidden" name="_wpnonce" value="607b79a577" id="newINPUT_7" />
</div>
<div id="newDIV_8">
    <p id="newP_9">
        <span id="newSPAN_10">*</span>שם מלא <span id="newSPAN_11"><input type="text" name="your-name" size="40" id="newINPUT_12" /></span>
    </p>
    <p id="newP_13">
         <span id="newSPAN_14">*</span>מייל <span id="newSPAN_15"><input type="email" name="your-email" size="40" id="newINPUT_16" /></span>
    </p>
    <p id="newP_17">
         <span id="newSPAN_18">*</span>טלפון <span id="newSPAN_19"><input type="text" name="your-subject" size="40" id="newINPUT_20" /></span>
    </p>
    <p id="newP_21">
         <span id="newSPAN_22">*</span>טלפון <span id="newSPAN_23"><input type="text" name="your-subject1" size="40" id="newINPUT_24" /></span>
    </p>
    <p id="newP_25">
    </p>
    <p id="newP_26">
        <span id="newSPAN_27"></span>
        <textarea name="textarea-863" cols="40" rows="10" id="newTEXTAREA_28">
        </textarea>
    </p>
    <p id="newP_29">
         <span id="newSPAN_30">*</span><span id="newSPAN_31"><span id="newSPAN_32"><span id="newSPAN_33"><span id="newSPAN_34">מאשר/ת רישום למאגר לקוחות</span>
                    <input type="checkbox" name="checkbox-973[]" value="מאשר/ת רישום למאגר לקוחות" id="newINPUT_35" /></span></span></span>
    </p>
    <p id="newP_36">
        <input type="submit" value="להרשמה" id="newINPUT_37" /><img src="http://www.lavierez.co.il/wp-content/plugins/contact-form-7/images/ajax-loader.gif" alt="Sending ..." id="newIMG_38" />
    </p>
</div>
<div id="newDIV_39">
</div>

Answer 1

使用html结构。在其中添加您的元素，并将表格内容右对齐。