テキストの上下中央配置

CSSで文字を上下左右中央に配置する方法いろいろ｜株式会社しずおかオンライン

この中では ⑤ or ⑥ のやり方がモダンっぽくて良さそう。

⑤flexboxで中央配置

.wrap.pattern-5 {
  height: 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

⑥CSS Gridレイアウトで中央配置

.wrap.pattern-6{
  height: 60px;
  display: grid;
  place-items: center;
}

CSSのID・クラス名の頭文字に数字を使用する方法 | webOpixel

CSSにおいて id, class に数字始まりの文字列は指定できない。

やむを得なく使う場合はエスケープが必要。

<p class="3">テスト</p>

.\33 {
    color: red;
}