如何使用表格对齐输入字段

时间:2013-07-22 19:01:21

标签: php css mysql html-table html-formatting

我在调整HTML表单中输入字段的宽度时遇到了问题。我谷歌,并在Stack Overflow网站上找到了一些解决方案。我创建了一个表并将输入字段放入其中。它解决了我的问题,但我不知道为什么整个表现在显示在页面的底部。我正在分享我的计划的一部分。请检查并指导我。

include 'connect.php';

//      $select_query=          'Select * from category';
//      $select_query_run =     mysql_query($select_query);

        echo "<div id='line' >
               <div id='form'>";

echo "  
    <form action='insert_product.php' method='POST' enctype='multipart/form-data' ></br></br>
    <table border=1>
    <tr>
    <td>
    <label>Product Name:</label> </td>  <td><input type='text' name='product_name'  />*Required</td></tr></br> </br>

    <tr><td><label>Item No:</label></td> <td><input type='text' name='item_no' ></td></tr></br></br>

    <tr><td>Recipient   </td>   <td> <input type='text' name='recipient' ></td></tr> </br></br>

<tr><td>    Total Carat Weight</td> <td><input type='text' name= 'total_carat_weight' ></td></tr></br></br>

<tr><td>    Metal </td><td><input type='text' name='metal' ></td></tr></br></br>

<tr><td>    Stone Shape </td><td><input type='text' name='stone_shape' ></td></tr></br></br>

<tr><td>    Stone Type</td><td> <input type='text' name='stone_type'></td></tr> </br></br>

<tr><td>    Stone Setting</td><td> <input type='text' name='stone_setting'></td></tr> </br></br>

<tr><td>    Wastage </td><td><input type='text' name='wastage'></td></tr></br></br>

<tr><td>    Retail_price </td><td><input type='text' name='retail_price' ></td></tr></br></br>

<tr><td>    Actual Price: </td><td> <input type= 'text' name= 'price'  /></td></tr>*Required</br> </br>

<tr><td>    Description:</td><td><input type='text' name='description'  /></td></tr></br></br>

<tr><td>    Image1:</td><td> <input type='file' name= 'image' ></td></tr> *Required</br></br>

<tr><td>    Image2:</td><td> <input type='file' name= 'image2' ></td></tr></br></br>

<tr><td>    Image3:</td><td> <input type='file' name= 'image3' ></td></tr></br></br></table>    ";




/*------------------
Drop Down List Start
------------------  */      


        echo "<select name='category'>";

            $select_query=          'Select * from category';
            $select_query_run =     mysql_query($select_query);

            $sub_category_query=    "Select * from sub_categories";
            $sub_query_run=         mysql_query($sub_category_query);



        while   ($select_query_array=   mysql_fetch_array($select_query_run) )
        {

                echo "<option value='".$select_query_array['category_id']."' >".
                htmlspecialchars($select_query_array["name"]).

                        "<option value='".$sub_query_run['sub_category_id']."'  >" .
                        htmlspecialchars($sub_query_run['sub_category_name']).   "</option>".

                "</option>";




            }
            echo "</br>";

     $selectTag= "</br><input type='submit' value='Insert Product'  /></select></form>";

     echo "</div></div>";

     echo $selectTag;

这是我的CSS档案。

#line
{
height: 900px; /*Specify Height*/
width:  790px; /*Specify Width*/
border: 1px solid #d5dfea; /*Add 1px solid border, use any color you want*/
background-color: #fafbfd; /*Add a background color to the box*/
text-align:left; /*Align the text to the center*/
/*margin: auto;*/
margin:10px;

box-shadow: 10px 5px 5px  #888888;
padding:20px;
}

#form
{
    margin :auto;
    padding:inherit;
    font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;


}

input, select, textarea {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

1 个答案:

答案 0 :(得分:1)

您的</br>项目是虚假的。

首先,如果您尝试使用兼容的xhtml进行编码,则需要<br />而不是您拥有的内容。

其次,不清楚换行在表格定义中的用途是什么。