HTML CSS Table内の文字をセンタリング中央寄せをしたい。

Question

Table内の文字をセンタリング中央寄せをしたいのですが、いろいろなプロパティを設定しても
文字が上下左右にセンタリングされません、解決方法はありますでしょうか...

--HTML

<table class="table-design"> <thead id="Head"> <tr> <th class="tmp"><p class="PCMD">COL1</p></th> <th class="mny">TableHeader2</th> <th class="mny">TableHeader3</th> <th class="mny">TableHeader4</th> <th class="mny">TableHeader5</th> <th class="mny">TableHeader6</th> </tr> </thead> <tbody> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> <tr> <td class="tmp">Contents1</td> <td class="mny">Contents2</td> <td class="mny">Contents3</td> <td class="mny">Contents4</td> <td class="mny">Contents5</td> <td class="mny">Contents6</td> </tr> </tbody> </table> --CSS .table-design{ table-layout: fixed; text-align:center; } .tmp { border: solid 1px; width:85px; height:30px; } .mny { border: solid 1px; width:128px; height:30px; } #Head{ position:absolute; background-color : #A4A4A4; }__イタリックテキスト__

Answer 1

.table-design th, .table-design td {
text-align: center;
vertical-align: middle;
}

Comments

[TaruOrder]

解答ありがとうございます!!!
思っていた通りの感じになりました。