form 揃えたいです。

html

 <center><form action="#">
    <dl>
    <dt>名前:</dt>
    <dd><input type="text" name="name" size="50" class="dai align"></dd>
    <dt>法人名:</dt>
    <dd><input type="text" name="name" size="60" class="dai align"></dd>
    <dt>メールアドレス:</dt>
    <dd><input type="email" name="mail" size="60" class="syou align"></dd>
    <dt>メールアドレス(確認用):</dt>
    <dd><input type="email" name="mail" size="60" class="syou align"></dd>
    <dt>郵便番号：</dt>
    <dd><input type="text" name="zip21" class="form_text-small  syou align">
    -
    <input type="text" name="zip22" class="form_text-small syou align" onkeyup="AjaxZip3.zip2addr('zip21','zip22','addr21','addr21');"></dd><br>
    <dt>都道府県:</dt>
    <dd><input type="text" name="addr21" class="form_text  syou align"></dd>
    <dt>TEL:</dt>
    <dd><input type="text" name="TEL" size="40" class="syou align"></dd>
    <dt>FAX:</dt>
    <dd><input type="text" name="FAX" size="40" class="syou align"></dd>
    <dt>ご注文数:</dt>
    <dd><input type="text" name="suzi" size="30" class="syou align"></dd>
    <dt>備考欄 その他特記事項がございましたらご利用ください。</dt><br>
   <dd><textarea name="kanso" rows="10" cols="60" class="align"></textarea></dd>
   </center>
   <!-- フォームメールの送信先メールアドレス -->
     <input type="hidden" name="tomail" value="wit@wit-ing.com">
     <input type="hidden" name="tosubj" value="cobrush注文">
     <input type="hidden" name="todelim" value="TAB">
     
     <p>
     <input type="image" src="img/mail_6.jpg" alt="送信">
     <button type="reset"><IMG src="img/mail_7.jpg"></button>
     </p>
   </form>

コード

css

form{
	width: 900px;
	padding:30px 50px;
	}
	
form dl dt{
	widhth: 165px;
	padding: 10px 0;
	float: left;
	clear: both;
	}
		
input.dai{
		height: 25px;
		margin-top:10px;
		margin-bottom:10px;
		}
		
input.syou{
	   height:15px;
	   margin-top:15px;
	   margin-bottom:15px;
	   }
	
form{
	padding:10px 0;
	}
	
element.style {
    padding-top: 300px;
}

コード

使用しているのはDWです。
入力フォームを揃えたいです。
まだまだ勉強中で見にくい部分もあるかとはおもいます。
このサイトも使うの初めてで記載方法が違うかもしれませんが、教えていただけると
助かります。

dit.

2019/10/03 02:37

https://teratail.com/questions/214994と同じ内容でしょうか？質問は編集することができるのでそちらでコードブロックへ対応していただければよかったのですが…。できれば重複質問として削除依頼を出してください。

shioazi0131

2019/10/03 02:39

使い方がいまいちわからなかったので

dit.

2019/10/03 02:42

今からでも問題ないので、どちらかに削除依頼を出し、片方を残してください。 1つ前のものを残すのであればそちらを編集し、コードをこの質問と同じようにコードブロックにしてください。

yambejp

2019/10/03 03:11 編集

いまどきcenterタグとか利用している時点でちょっとhtmlや cssの知識が足りてないかもしれません具体的にどう揃えたいのでしょう？手書きでいいので画像で提示されるとわかりやすいかと思います。またhtml自体を変更してもよいのしょうか？（jsは利用したくない？）

shioazi0131

2019/10/03 03:17

すみません、色々調べながら使えるものを継ぎ接ぎの状態で使っております。どれが今どきなのかなどは理解出来ておりません。 HTML自体は変更しても大丈夫です。がJSは利用しない方向で考えております…。申し訳ございません。

行動規範の内容に同意します

回答1件

とりあえず揃っていればいいならこんな感じ
（一部手を抜いているので公開の際は精査してください）

CSS
1<style>
2#wrap table{
3margin:auto;
4}
5</style>
6<div id="wrap">
7<form action="#">
8<table>
9<tbody>
10<tr>
11    <th>名前:</th>
12    <td><input type="text" name="name" size="50" class="dai align"></td>
13</tr>
14<tr>
15    <th>法人名:</th>
16    <td><input type="text" name="name" size="60" class="dai align"></td>
17</tr>
18<tr>
19    <th>メールアドレス:</th>
20    <td><input type="email" name="mail" size="60" class="syou align"></td>
21</tr>
22<tr>
23    <th>メールアドレス(確認用):</th>
24    <td><input type="email" name="mail" size="60" class="syou align"></td>
25</tr>
26<tr>
27    <th>郵便番号：</th>
28    <td><input type="text" name="zip21" class="form_text-small  syou align">
29    -
30    <input type="text" name="zip22" class="form_text-small syou align" onkeyup="AjaxZip3.zip2atdr('zip21','zip22','atdr21','atdr21');"></td>
31</tr>
32<tr>
33    <th>都道府県:</th>
34    <td><input type="text" name="atdr21" class="form_text  syou align"></td>
35</tr>
36<tr>
37    <th>TEL:</th>
38    <td><input type="text" name="TEL" size="40" class="syou align"></td>
39</tr>
40<tr>
41    <th>FAX:</th>
42    <td><input type="text" name="FAX" size="40" class="syou align"></td>
43</tr>
44<tr>
45    <th>ご注文数:</th>
46    <td><input type="text" name="suzi" size="30" class="syou align"></td>
47</tr>
48<tr>
49    <th>備考欄</th><br>
50   <td><textarea name="kanso" rows="10" cols="60" class="align"></textarea><br>その他特記事項がございましたらご利用ください。</td>
51</tr>
52</tbody>
53</table>
54<input type="hidden" name="tomail" value="wit@wit-ing.com">
55<input type="hidden" name="tosubj" value="cobrush注文">
56<input type="hidden" name="todelim" value="TAB">
57<p>
58  <input type="image" src="img/mail_6.jpg" alt="送信">
59  <button type="reset"><IMG src="img/mail_7.jpg"></button>
60</p>
61</form>
62</div>