SilvioCro SilvioCro - 7 months ago 17
HTML Question

Tables aren't in center | HTML & CSS

I made tthese tables, design of 1st tabel is design I wanted, but design of 2nd tabel has less space between left and right column. Why? How to fix 2nd design so 2nd tabel gets design like 1st? Thanks!

<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>


I use Bootstrap. Here's a image - http://i.imgur.com/7EQBHNQ.png

Answer

You can use <thead> and <tbody> for your table.
In the table header you can define the width of each column.

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

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