Reputation: 2045
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.
Upvotes: 0
Views: 258
Reputation: 529
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;
}
Upvotes: 1
Reputation: 30581
Your CSS syntax is off.
table.center
{
margin-left:auto;
margin-right:auto;
}
td {
border-color:Blue;
border-style:double;
color:#8A2BE2F;
}
Upvotes: 3
Reputation: 11506
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;
Upvotes: 0
Reputation: 8062
you missing syntax, need to prefix class with "."
.center.vorder, td
{}
Refer working fix http://jsbin.com/azoxes/1/edit
Upvotes: 1