スタイルシートのテーブルにクラス名を付けたい

Question

ご質問されて頂きます。
WORDPRESS初心者です。
テーマは「Twenty Fourteenバージョン: 2.4」です。

●したいこと
スタイルシートのテーブルをオリジナルにするために
テーブルにクラス名をつけたい。

テーマのテーブルはこのように書かれていました。

.entry-content table,
.comment-content table{ width: 100%;
border-collapse: collapse;
}

.entry-content th,
.comment-content th{

border-bottom: #e3e3e3 1px solid;
border-left: #e3e3e3 1px solid;
text-align: left;
background: #f7f7f7;
padding: 10px;
font-weight: normal;

}

.entry-content td,
.comment-content td{
border-top: #b3b3b3 4px solid;
border-bottom: #e3e3e3 1px solid;
border-right: #e3e3e3 1px solid;
text-align: left;
padding: 10px;
}

テーブルのクラス名「ma01」にするために以下のようにしたところ
テーブルが消えてしまいました。

クラスの付け方が悪いと思いますのですが
どのようにしたら宜しいでしょうか？

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

.entry-content table.m01,
.comment-content table.m01{ width: 100%;
border-collapse: collapse;
}

.entry-content th.m01,
.comment-content th.m01{

border-bottom: #e3e3e3 1px solid;
border-left: #e3e3e3 1px solid;
text-align: left;
background: #f7f7f7;
padding: 10px;
font-weight: normal;

}

.entry-content td.m01,
.comment-content td.m01{
border-top: #b3b3b3 4px solid;
border-bottom: #e3e3e3 1px solid;
border-right: #e3e3e3 1px solid;
text-align: left;
padding: 10px;
}

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
html

<table class="m01"> <tr> <td>要素</td><td><?php the_field('THEMA'); ?></td><td></td> </tr> <tr> <td>要素</td><td>要素</td><td>要素</td> </tr> </table>

Comments

[退会済みユーザー]

編集可能ですのでコードは``` ```で囲ってください。

Answer 1

<div class="entry-content">
  <table class="m01">
    <tr>
      <td class="m01">要素</td>
      <td class="m01"><?php the_field('THEMA'); ?></td>
      <td class="m01"></td>
    </tr>
    <tr>
      <td class="m01">要素</td>
      <td class="m01">要素</td>
      <td class="m01">要素</td>
    </tr>
  </table>
</div>

Comments

[yasaidemo]

ご回答ありがとうございます。

divで要素をグループ化して
ひとつひとつのタグにクラス名をかくのですね。
解決しました。