0

画像

これは、次のコードが生成するものです。すべての画面サイズで、テキストボックスとテキストを並べるのを手伝ってもらえますか? もともと、各テキストの高さをテキストボックスに合わせて設定したかったのですが、サイズの異なる画面では並べられないことに気付きました。どんな助けでも大歓迎です。

<body>

<h1>Contact Us</h1>

<p>Please take a few moments to fill out our feedback form. It will help us to better     address your needs. Thank you.</p>

<div id="mainLeft">
<table border="0" style="z-index: 1; position: inline; width: 440px; height: 334px; left: 0px; top: 0px;" width="644">
<tbody>
    <tr>
        <td height="40" scope="col" width="144"><strong><span class="style4"><span class="style5">Your Name:</span> &nbsp;</span></strong></td>
        <td height="269" rowspan="10" scope="col" width="267">
        <form action="send-form.php" id="form" method="post" name="form">
        <p><input id="name" name="name" size="35" type="text" value="" />        </p>

        <p><input id="email" maxlength="55" name="email" size="35" type="text" /></p>

        <p><input id="address" maxlength="55" name="address" size="35" type="text" /></p>

        <p><input id="city" maxlength="55" name="city" size="35" type="text" /></p>

        <p><input id="state" maxlength="55" name="state" size="15" type="text" /></p>

        <p><input id="zip" maxlength="55" name="zip" size="25" type="text" /></p>

        <p><input id="telephone" maxlength="55" name="telephone" size="35" type="text" /></p>

        <p><input id="fax" maxlength="55" name="fax" size="35" type="text" /></p>

        <p><input id="feedback" maxlength="55" name="feedback" size="35" type="text" /></p>

        <p><textarea cols="30" id="comments" name="comments" rows="7" wrap="virtual"></textarea></p>
        <input name="Submit" onclick="MM_validateForm('email','','RisEmail','phone','','NisNum','comments','','R');ret​urn document.MM_returnValue" tabindex="1" type="submit" value="Submit" />&nbsp;</form>
        </td>
    </tr>

    <tr>
        <td height="0" scope="col"><strong><span class="style6">Email Address: &nbsp;</span><br /></strong></td>
    </tr>
    <tr>
        <td height="0" scope="col"><strong><span class="style6">Mailing Address: &nbsp;</span><br /></strong></td>
    </tr>
    <tr>
        <td height="0" scope="col"><strong><span class="style6">City: &nbsp;</span></strong></td>
    </tr>
    <tr>
        <td height="0" scope="col"><strong><span class="style6">State: &nbsp;</span></strong></td>
    </tr>
    <tr>
        <td height="0" scope="col"><strong><span class="style6">Zip Code: &nbsp;</span></strong></td>
    </tr>
    <tr>
        <td height="0" scope="col"><strong><span class="style6">Telephone: &nbsp;</span></strong></td>
    </tr>
    <tr>
        <td height="0"scope="col"><strong><span class="style6">Fax: &nbsp;</span></strong></td>
    </tr>
            <tr>
        <td height="0" scope="col"><strong><span class="style6">How did you hear about us?: &nbsp;</span></strong></td>
    </tr>

        <td scope="col"><span class="style6"><strong>Explanation of your legal situation: </strong></span><strong><span class="style4">&nbsp;</span></strong></td>
    </tr>
    <tr>
        <td align="right">&nbsp;</td>
        <td align="right" height="35">&nbsp;</td>
        <td align="left" height="35">&nbsp;</td>
    </tr>
</tbody>
</table>
</div>
</body>
4

4 に答える 4

1

そのためにテーブルを使用しないでください...次のような単純なものを使用してください：

<label for="name">Your name:</label><input type="text" name="name" /><br />
<label for="email">Email address:</label><input type="text" name="email" /><br />

等...

<br />CSS ですべてを適切にスタイル設定すれば、改行 ( ) さえ必要ないかもしれません。

于 2013-06-17T03:20:05.280 に答える
0

for属性を持つラベルを使用してみてください。

この例では、実際にテキスト フィールドの横にラベルを配置します。

<label for="myField">foo</label>
<input type="text" name="myField" id="myField" />

ここにテーブルは必要ありません。

于 2013-06-17T03:22:10.917 に答える