CSS水平垂直方向の中心問題

水平センター：

• インライン要素：テキスト整列：センター。
• ブロックレベル要素：magin：0自動。
• 子要素のセット：位置：絶対;左：50％;変換：移動X（-50％）。
• 親要素が提供されます。表示：フレックス;正当化 - コンテンツ：センター;

 

垂直方向の中心：

• 行の高さ：高さ;
• 子要素のセット：位置：絶対;トップ：50％;変換：移動Y（-50％）。
• 親要素が提供される：ディスプレイ：屈曲、ALIGN-アイテム：センター;

水平および垂直方向の中心：

• 表示：フレックス。正当化 - コンテンツ：センター; ALIGN-アイテム：センター;
• .parent {位置：相対。} .children {位置：絶対。幅：200pxの。高さ：100pxに。トップ：50％; 左：50％; margin-left：-100px; マージントップ：-50px;}
• .parent {位置：相対;} .children {位置：絶対。幅：200pxの。高さ：100pxに。トップ：50％; 左：50％; 変換：変換（-50％、 - 50％）}
• .parent {位置：相対;} .children {位置：絶対。トップ：0; 下：0; 左：0; 右：0; マージン：自動;}