表不在中心| HTML＆CSS

Question

我做了這些表格，第一個tabel的設計是我想要的設計，但是第二個tabel的設計在左右列之間有較小的空間。爲什麼？如何修復第二個設計，以便第二個tabel獲得像1st一樣的設計？謝謝！

    <div class="_hsync_login_form"> 
        <p style="font-family: 'Noto Sans'; text-align: center;"> 
         Došli ste do kraja, no prije samog kraja još jednom pregledajte sve podatke koje ste upisali. Ukoliko niste zadovoljni podacima, registraciju možete vrlo lako resetirati. 
        </p> 
        <p style="font-family: 'Noto Sans'; text-align: center;"> 
         Napominjemo da nakon prve prijave na server morate proći kroz roleplay test. Ukoliko Vam je potrebno, također možete proći kroz roleplay predavanje koje traje oko 10-ak minuta. 
        </p>  
        <br />      
        <h3></strong>IN CHARACTER</strong></h3> 
        <hr class="_hsync_login_box_hr"> 
        <br/> 
        <table class="table" style="text-align: center;">    
         <tr> 
          <td style="border-top: 0px;">Ime i prezime</td> 
          <td style="border-top: 0px; font-family: 'Noto Sans';">Ime_Prezime</td> 
         </tr> 
         <tr> 
          <td style="border-top: 0px;">Starost</td>       
          <td style="border-top: 0px; font-family: 'Noto Sans';">16</td> 
         </tr> 
         <tr> 
          <td style="border-top: 0px;">Spol</td>       
          <td style="border-top: 0px; font-family: 'Noto Sans';">Žensko</td> 
         </tr>        
        </table> 
        <br /> 

        <h3></strong>OUT OF CHARACTER</strong></h3> 
        <hr class="_hsync_login_box_hr"> 
        <br/>       
        <table class="table" style="text-align: center;">    
         <tr> 
          <td style="border-top: 0px;">Zaporka</td>       
          <td style="border-top: 0px;">&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;</td> 
         </tr> 
         <tr> 
          <td style="border-top: 0px;">e-Mail adresa</td>       
          <td style="border-top: 0px; font-family: 'Noto Sans';">haswell.samp@hotmail.com</td> 
         </tr> 
         <tr> 
          <td style="border-top: 0px;">e-Mail obavijesti</td>       
          <td style="border-top: 0px; font-family: 'Noto Sans';">Da</td> 
         </tr> 
         <tr> 
          <td style="border-top: 0px;">Verifikacija</td>       
          <td style="border-top: 0px; color: green; font-family: 'Noto Sans';">Urađena</td> 
         </tr>                                
        </table> 

        <br /> 
        <!-- UKOLIKO RAČUN PRVO TREBA PROĆI ODOBRENJE --> 
        <div class="alert alert-warning" role="alert"> 
         <span class="glyphicon glyphicon-exclamation-sign"></span>Vaš račun prvo mora biti provjeren i odobren od strane administratora. Nakon provjere primiti ćete e-Mail s obavijesti o statusu računa. 
        </div>                    
       </div> 

我使用Bootstrap。這裏是一個圖像 - http://i.imgur.com/7EQBHNQ.png

Answer 1

您可以使用<thead>和<tbody>爲您的表。
在表頭中，您可以定義每列的寬度。

http://www.w3schools.com/tags/tag_thead.asp

http://www.w3schools.com/tags/att_th_width.asp

Answer 2

我認爲這是因爲<td>標籤的內容。 要解決第二個設計，使第二TABEL被設計像1，你可以添加樣式

<style type="text/css"> 
    tr td { 
     width: 50%; 
    } 
</style>