<p><a href="">フレックスを使用したボタン</a></p>
p{
  width: auto;
  height: auto;
}
p a{
  display: flex;
  justify-content: center;/* 左右 */
  align-items: center;/* 上下 */
  width: 300px;
  height: 100px;
  background-color: #333;/* 背景色 */
  border-radius: 10px;/* 角丸 */
  color: #fff;/* 文字カラー */
  text-decoration: none;/* アンダーライン消す */
}

/* ホバー設定 */
p a:hover{
  background-color: #888;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.