Wie platziert man die "Tabelle" in der Mitte der Webseite?

Question

Ich habe eine sehr einfache Tabellenstruktur in der Mitte/Mitte der Webseite platziert werden. Ich habe einen Code unten, ich weiß seine unvollständig, damit dies geschieht, wie ich den HTML-Teil bei der Strukturierung schlecht bin, bitte helfen Sie mir

<div align="center" style="vertical-align:bottom"> 
<div align="center" style="vertical-align:bottom"> 
<table> 
<tr><td colspan="2"></td></tr> 
<tr><td>Name</td><td>J W BUSH</td></tr> 
<tr><td>Proficiency</td><td>PHP</td></tr> 
<tr><td>COmpany</td><td>BLAH BLAH</td></tr> 
</table> 
</div> 
</div> 

auch erklären Sie das Konzept hinter der Anwendung von Eigenschaften und CSS in dieses Ziel zu erreichen Zeit der Strukturierung. so dass ich es im weiteren Lernen verwenden kann ....

Ich bin völlig Neuling und dumm in HTML-CSS verwenden ... Also ich fordere Sie alle Techies und Geeks auf, mit meinen dummen Fragen von HTML-CSS zu ertragen Strukturierung .. Bitte nicht die Kommentare hinterlassen, die mich demoralisieren mit dem Lernen, wie gehen sie vor: „Ist es ein Hausaufgaben ...“ oder etc „TO tution KLASSEN gO“ ...

Answer 1

Die kürzeste und einfachste Antwort lautet: Sie sollten Dinge nicht vertikal in Webseiten zentrieren. HTML und CSS sind einfach nicht in diesem Sinne erstellt. Sie sind Textformatierungssprachen, keine Benutzeroberflächen-Designsprachen.

Das gesagt, das ist der beste Weg, den ich mir vorstellen kann. Dies funktioniert jedoch NICHT im Internet Explorer 7 und darunter!

<style> 
    html, body { 
    height: 100%; 
    } 
    #tableContainer-1 { 
    height: 100%; 
    width: 100%; 
    display: table; 
    } 
    #tableContainer-2 { 
    vertical-align: middle; 
    display: table-cell; 
    height: 100%; 
    } 
    #myTable { 
    margin: 0 auto; 
    } 
</style> 
<div id="tableContainer-1"> 
    <div id="tableContainer-2"> 
    <table id="myTable" border> 
     <tr><td>Name</td><td>J W BUSH</td></tr> 
     <tr><td>Proficiency</td><td>PHP</td></tr> 
     <tr><td>Company</td><td>BLAH BLAH</td></tr> 
    </table> 
    </div> 
</div> 

Answer 2

starten:

<style type="text/css"> 
     .myTableStyle 
     { 
      position:absolute; 
      top:50%; 
      left:50%; 

      /*Alternatively you could use: */ 
      /* 
       position: fixed; 
       bottom: 50%; 
       right: 50%; 
      */ 


     } 
    </style>