CSS的保证金不起作用

Question

I have Table and I want to put it in the middle of the page. If I set align attribute to center, it works but I want to do that with CSS. Here is my CSS:

center vorder, td
{
  border-color:Blue;
  border-style:double;
  color:#8A2BE2F;
  margin-left:auto;
  margin-left:auto;
  margin-right:auto;

}

and this is my table code:

<table class="center vorder" >
<tr><td colspan="4">mittige Tabelle</td></tr>
<tr><td>Element 0 0</td><td>Element 0 1</td><td>Element 0 2</td><td>Element 0 3</td></tr>
<tr><td>Element 1 0</td><td>Element 1 1</td><td>Element 1 2</td><td>Element 1 3</td></tr>
<tr><td>Element 2 0</td><td>Element 2 1</td><td>Element 2 2</td><td>Element 2 3</td></tr>
</table>

Thank you for your help.

Answer 1

Your CSS syntax is off.

table.center
{
  margin-left:auto;
  margin-right:auto;

}

td {
  border-color:Blue;
  border-style:double;
  color:#8A2BE2F;
}

Answer 2

you missing syntax, need to prefix class with "."

.center.vorder, td
{}

Refer working fix http://jsbin.com/azoxes/1/edit

Answer 3

You sould use . for class in CSS:

.center.vorder
{
  border-color: blue;
  border-style: double;
  color: #8A2BE2F;
  margin: 0 auto;
}

If you want center the td's text you shuld use this:

td
{
    text-align: center;
}

Answer 4

From that code, your css is not even getting used. It should be something like:

.center.vorder, td

or

.center.vorder td

..depending on what you want to target.

Also you have margin-left: auto twice, so remove one. You can do it in one line like so:

margin: 0 auto;