テーブルセルを中心に合わせる

以下は私のテーブルのコードです。私は最後のセル（ログアウト）をテーブルの中心に揃えたい。それは左に揃えられていて、中央に揃えたいと思っています。テーブルセルを中心に合わせる

<table width="50%" border="0"> 
    <tr> 
    <td><div align="center"><a href="viewjobseeker.php"><img src="\Proj main\images\Edu.png" alt="" width="64" height="64" /></div></td></a> 
    <td><div align="center"><a href="viewemployer.php"><img src="\Proj main\images\Profile.png" alt="" width="64" height="64" /></div></td></a> 
    <td><div align="center"><a href="viewjob.php"><img src="\Proj main\images\jobopening.jpg" alt="" width="64" height="64" /></div></td></a> 
    </tr> 
    <tr> 
    <td bgcolor="#A0B9F3"><div align="center"><a href="viewjobseeker.php"><strong>View JobSeeker Profile</strong></a></div></td> 
    <td bgcolor="#A0B9F3"><div align="center"><a href="viewemployer.php"><strong>View Employer Porfile</strong></a></div></td> 
    <td bgcolor="#A0B9F3"><div align="center"><a href="viewjob.php"><strong>View Job Opening</strong></a></div></td> 
    </tr> 
    <tr> 
    <td><div align="center"><a href="editjobseekeradmin.php"><img src="\Proj main\images\edit.png" alt="" width="64" height="64" /></div></td></a> 
    <td><div align="center"><a href="editemployeradmin.php"><img src="\Proj main\images\editemployer.png" alt="" width="64" height="64" /></div></td></a> 
    <td><div align="center"><a href="checkfeedbackadmin.php"><img src="\Proj main\images\Feedback.png" alt="" width="64" height="64" /></div></td></a> 
    </tr> 
    <tr> 
    <td bgcolor="#A0B9F3"><div align="center"><a href="editjobseekeradmin.php"><strong>Edit JobSeeker Profile</strong></a></td> 
    <td bgcolor="#A0B9F3"><div align="center"><a href="editemployeradmin.php"><strong>Edit Employer Profile</strong></a></div></td> 
    <td bgcolor="#A0B9F3"><div align="center"><a href="checkfeedbackadmin.php"><strong>Check feedback</strong></a></div></td> 

    </tr><div id="center1"> 
    <tr align="center"> 
    <center> 
    <td align="center"><div align="center"><a href="logoutadmin.php"><img src="\Proj main\images\Log.png" alt="" width="64" height="64" /></div></td></tr></a> 
    <tr align="center">  
    <td bgcolor="#A0B9F3" align="center"><div align="center"><a href="logoutadmin.php"><strong>Logout</strong></a></div></td> 
    </tr></div></center> 
</table>

これは、テーブルのスクリーンショットです：

出典

2016-11-22 ameyad09

コードにヒープの構文エラーがあります。 [a HTML Validator]（https://validator.w3.org/#validate_by_input）でコードを実行し、すべてのエラーを修正したときに戻ってくることをお勧めします。 – Turnip

ちなみに、メニューの書式設定にはテーブルを使わないでください。その代わりに、 'div'sを使い、色を設定し、CSSを使って書式を整えるなど、良いHTMLチュートリアルで教えてください。 – erickrf

私が共有したばかりのスクリーンショットを確認してください。ログアウトは真ん中に来るはずです。 – ameyad09

見ては、ということですあなたは何を意味するのか？

私がしたのは、不要なdivをすべて消去し、最後の2行にあるtdの両側に空のtdを追加することでした。

<tr align="center"> 
    <td></td> 
    <td text-align="center"> 
     <div align="center"> 
      <a href="logoutadmin.php"><img src="\Proj main\images\Log.png" alt="" width="64" height="64" /> </a></div> 
    </td> 
    <td></td> 
</tr> 

<tr align="center"> 
    <td></td> 
    <td bgcolor="#A0B9F3" align="center"> 
     <div align="center"><a href="logoutadmin.php"><strong>Logout</strong></a></div> 
    </td> 
    <td></td> 
</tr>

出典

2016-11-22 14:51:33 DavSev

私が今共有したスクリーンショットを確認してください。ログアウトは真ん中に来るはずです。 – ameyad09

ログアウトは最後の行の中央にあります。あなたは私のバイブルをチェックしましたか？ https://jsfiddle.net/davseveloff/e3j4oacj/1/ – DavSev

あなたのコードを試してみました...ログアウトは中に入っていますが、左右両方の境界線が現れています。どうすればいいですか？ – ameyad09

は、以下のコードを使用します。 HTML：

<table> 
    <tr> 
     <td><div><a href="viewjobseeker.php"><img src="\Proj main\images\Edu.png" alt="" width="64" height="64" /></a></div></td> 
     <td><div><a href="viewemployer.php"><img src="\Proj main\images\Profile.png" alt="" width="64" height="64" /></a></div></td> 
     <td><div><a href="viewjob.php"><img src="\Proj main\images\jobopening.jpg" alt="" width="64" height="64" /></a></div></td> 
    </tr> 
    <tr> 
     <td><div><a href="viewjobseeker.php"><strong>View JobSeeker Profile</strong></a></div></td> 
     <td><div><a href="viewemployer.php"><strong>View Employer Porfile</strong></a></div></td> 
     <td><div><a href="viewjob.php"><strong>View Job Opening</strong></a></div></td> 
    </tr> 
    <tr> 
     <td><div><a href="editjobseekeradmin.php"><img src="\Proj main\images\edit.png" alt="" width="64" height="64" /></a></div></td> 
     <td><div><a href="editemployeradmin.php"><img src="\Proj main\images\editemployer.png" alt="" width="64" height="64" /></a></div></td> 
     <td><div><a href="checkfeedbackadmin.php"><img src="\Proj main\images\Feedback.png" alt="" width="64" height="64" /></a></div></td> 
    </tr> 
    <tr> 
     <td><div><a href="editjobseekeradmin.php"><strong>Edit JobSeeker Profile</strong></a></td> 
     <td><div><a href="editemployeradmin.php"><strong>Edit Employer Profile</strong></a></div></td> 
     <td><div><a href="checkfeedbackadmin.php"><strong>Check feedback</strong></a></div></td> 
    </tr> 
    <tr> 
    <td colspan="3"><div><a href="logoutadmin.php"><img src="\Proj main\images\Log.png" alt="" width="64" height="64" ></a></div></td> 
    </tr> 
    <tr> 
    <td colspan="3"><div><a href="logoutadmin.php"><strong>Logout</strong></a></div></td> 
    </tr> 
</table>

CSS：このlinkで

table { 
width:50%; 
} 
table, table td { 
    border: 1px solid #111; 
    border-collapse: collapse; 
} 
table div{ 
text-align:center; 
} 
table td{ 
background:#A0B9F3; 
}

出典

2016-11-22 14:47:04

テーブルセルを中心に合わせる

答えて

関連する問題