CSSで要素を横方向に中央揃えの方法

親要素内で要素を中央に配置するには、いくつかの方法があります:

  1. 絶対位置と負のマージンを使用する
  2. child {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    }
  3. 絶対配置と margin:autoの使用:
  4. 親要素 {
    相対位置;
    }子要素 {
    絶対位置;
    上: 0;
    右: 0;
    下: 0;
    左: 0;
    余白: 自動;
    }
  5. フレックスレイアウトを使用する:
  6. 親要素 { display: flex; justify-content: center; align-items: center; }

これらの方法は、親要素内で要素を水平と垂直に中央揃えにすることができます。状況に応じて適した方法を選択してください。

bannerAds