Question

我一直在阅读stackoverflow上的所有各种帖子，但我还是面临一个问题。请不要将其重复。

即使我使用id="clientLogin"和float:center/middle;等，我也无法对齐表单position。但是无法取得成功。请修复我的问题，或者我是否犯了任何错误请更新一下。 谢谢你提前！ Screenshot of image

CSS文件：https://pastebin.com/Pqvu0s9h

＆＃13;

  <div id="content">
        
         <h1>Check Ticket Status</h1>
<p>To view the status of a ticket, provide us with the login details below.</p>
<form action="login.php" method="post" id="clientLogin">
    <strong></strong>
    <br>
    <div>
        <label for="email">E-Mail Address:</label>
        <input id="email" type="text" name="lemail" size="30" value="">
    </div>
    <div>
        <label for="ticketno">Ticket ID:</label>
        <input id="ticketno" type="text" name="lticket" size="30" value=""></td>
    </div>
    <p>
        <input class="btn" type="submit" value="View Status">
    </p>
    </form>
<br>
<p>
If this is your first time contacting us or you've lost the ticket ID, please <a href="home.php">open a new ticket</a>.    
</p>
        </div>
        
        

    </div>

＆＃13;

Answer 1

像这样更改选择器#clientLogin的css。您需要删除属性position: absolute;

#clientLogin {
  width: 400px;
  margin-top: 20px;
  padding: 10px 100px 10px 10px;
  border: 1px solid #ccc;
  background: url('/assets/copyright-shiv/images/lock.png?1319655200') 440px 50% no-repeat #FCF5E9;
  margin-left: auto;
  margin-right: auto;
}

Answer 2

这是使用error_reporting(E_ALL); ini_set("display_errors", 1);完成的，但也可以在table中完成。（请参阅form姓名和class姓名）

＆＃13;

ID

＆＃13;

.content {
  display: flex;
  align-items: center;
  justify-content: center;
}

#clientLogin{
  max-width: 50%;
}

＆＃13;

表格对齐到中心

2 个答案: