[방법 1]
To center a table, you need to set the margins, like this:
table.center {margin-left:auto; margin-right:auto;}
And then do this:
<table class="center">
...
</table>
At this point, Mozilla and Opera will center your table. Internet Explorer 5.5 and up, however,
needs you to add this to your CSS as well:
body {text-align:center;}
[방법2]
If you want your table to be a certain percentage width, you can do this:
table#table1 {width:70%; margin-left:15%; margin-right:15%;}And then in your HTML/XHTML, you would do this:
<table id="table1"> ... </table>
Note that I was using an id to describe the table. You can only use an id once on a page. If you had many tables on a page that you wanted to be the same width and centered, you would do this in your CSS:
table.center {width:70%; margin-left:15%; margin-right:15%;}And this in your HTML:
<table class="center"> ... </table><table class="center"> ... </table>[방법3]If you want your table to be of fixed width, define your CSS like this:
div.container {width:98%; margin:1%;} table#table1 {text-align:center; margin-left:auto; margin-right:auto; width:100px;} tr,td {text-align:left;}Set "width:100px" to whatever width you need.
"text-align: center" is there for Internet Explorer, which won't work without it. Unfortunately, "text-align: center" will center all the text inside your table cells, but we counter that by setting "tr" and "td" to align left.
In your HTML, you would then do this:
<div class="container"> <table id="table1"> ... </table> </div>