htmlフォーム要素を整列するのが難しい

<!DOCTYPE html> 
<html> 
<head> 
</head> 
<body bgcolor="#E6E6FA"> 
    <form name="orders" action="ordering_action.php" method="post" enctype="multipart/form-data" onsubmit="validate()"> 

     <table align="Center" > 
      <tr> 
      <td height="50" width=330>Prescription 1:<div id="kids"> 

    <input type="file" required name="Image1"> 
    <input type="button" id="add_kid()" onclick="addkid()" value="+" />(MAX 3) 
    </div></td></tr> 
      <tr><td height="40">NIC 
     <input class="textfill" type=text required name=NIC placeholder="XXXXXXXXXV" ></td></tr> 
     <tr><td ><div>Pick up 
      <input type=radio name=DP required value="Pickup"> 


      Delivery 
       <input class="textfill" type=radio name=DP required value="Delivery" onmouseup="textbox(this)"/></div></td></tr> 



     <tr><td height="50"><div>Time 
     <input class="textfill" type=time name=DPTime required></div></td></tr> 
     <tr><td height="50"><div>Telephone 
     <input class="textfill" type=text name=Tele required ></div></td></tr> 
     <tr><td height="50"><div>Email 
     <input class="textfill" type=email required name=Email placeholder="[email protected]" ></div></td></tr> 



     <tr><td colspan=5 align=center> 
      <input class="button" type=submit name=submit value=Send> 
      <input class="button" type=reset name=reset value=Cancel> </td></tr> 
     </table>   

      </form> 

    </body> 
</html>

これは私のHTMLコードです。配信ラジオボタンを含むすべてのテキストボックスが「+」ボタンの下に配置されるように修正する必要がありますhtmlフォーム要素を整列するのが難しい

出典

2016-09-03 Kasun Sampath

http://validator.w3.org/nu/ – Quentin

はdiv要素内のすべての入力をラップしてもに応答しているあなたはまた、それを整合させるために、ブートストラップのdivを使用することができますALIGN =「右」

を提供曲がっビット）ように見えます異なる画面サイズ。

http://getbootstrap.com/components/

出典

2016-09-03 12:28:26

このコードを試してください。

 <!DOCTYPE html> 
    <html> 
    <head> 
     <style>input.textfill { 
     float: right; 
    }</style> 
    </head> 
    <body bgcolor="#E6E6FA"> 
     <form name="orders" action="ordering_action.php" method="post" enctype="multipart/form-data" onsubmit="validate()"> 

      <table align="Center" > 
       <tr> 
       <td height="50" width=330>Prescription 1:<div id="kids"> 

     <input type="file" required name="Image1"> 
     <input type="button" id="add_kid()" onclick="addkid()" value="+" />(MAX 3) 
     </div></td></tr> 
       <tr><td height="40">NIC 
      <input class="textfill" type=text required name=NIC placeholder="XXXXXXXXXV" ></td></tr> 
      <tr><td ><div style=" float: right;">Pick up 
       <input type=radio name=DP required value="Pickup"> 


       Delivery 
        <input class="textfill" type=radio name=DP required value="Delivery" onmouseup="textbox(this)"/></div></td></tr> 



      <tr><td height="50"><div>Time 
      <input class="textfill" type=time name=DPTime required></div></td></tr> 
      <tr><td height="50"><div>Telephone 
      <input class="textfill" type=text name=Tele required ></div></td></tr> 
      <tr><td height="50"><div>Email 
      <input class="textfill" type=email required name=Email placeholder="[email protected]" ></div></td></tr> 



      <tr><td colspan=5 align=center> 
       <input class="button" type=submit name=submit value=Send> 
       <input class="button" type=reset name=reset value=Cancel> </td></tr> 
      </table> 

       </form> 

     </body> 
    </html>

入力ボックスが今フローティングさ

出典

2016-09-03 12:41:33

htmlフォーム要素を整列するのが難しい

答えて

関連する問題