html - 中央揃えの10列のHTMLページを中央揃えにする方法は？

Question

1）こんにちは、http：//www.getustad.com/TableProject/は10列のページで、ページの中央に配置する必要があります。ページの解像度を変更した場合[大きな画面に移動]、すべての列を変更しないでください。左に移動します。

2）画面の解像度に依存しないHTMLビューを作成するにはどうすればよいですか？

助けてくださいありがとう

Answer 1

次のような幅のプロパティが設定されているdivですべての列をラップします

<div id="main_body">
   <div class="column"></div>
   <div class="column"></div>
   <div class="column"></div>
   <div class="column"></div>
   <div class="column"></div>
   <div class="column"></div>
   <div class="column"></div>
   <div class="column"></div>
   <div class="column"></div>
   <div class="column"></div>
</div>

Set the css properties of main_body to whatever u want. ex: align:center. width:840px; etc

Answer 2

テーブルの ID が「mytable」の場合、次のようにします。

table#mytable
{
    margin-left: auto;
    margin-right: auto;
    width: 50em;
}

ただし、古いブラウザでは機能しません。

Answer 3

ちょっと今、あなたはこのようにあなたのhtmlとcssコードを変更することができます

CSS コード

#main{
margin:0 auto;
    border:solid 1px red;
    text-align:center;

}

.box{
margin:2px;
    background:rgba(0,0,0,0.2);
    display:inline-block;
    vertical-align: top;
}

HTML コード

<div id="main">
    <div class="box">
    <img src="">
        <p>Oncenter</p>
    </div>


    <div class="box">
    <img src="">
        <p>Oncenter</p>
    </div>



    <div class="box">
    <img src="">
        <p>Oncenter</p>
    </div>


    <div class="box">
    <img src="">
        <p>Oncenter</p>
    </div>

</div>

ライブデモ http://jsfiddle.net/TKMCc/