CSSグリッド - コンテンツを横方向に、縦方向に中央に整列できますか？

Question

これを回避するにはいくつかの方法が考えられますが、これをネイティブに行う方法がないのが私の質問です。

私のページにはフッターがあります。私はフッターに右揃えのテキストを表示したい。しかし、私はまた、テキストセンターを垂直に揃えたいと思っています。

すぐに考えてみましょう。エレメントにいくつかのパディングを追加することですが、後でフッタをサイズ変更可能にすると、デザインが破損します。ネイティブのFlexgridオプションを使用しない他のCSSアプローチもあります。

他のアイデアは、（例えば、任意の要素）のDIV内のDIVを配置し、第一ALIGN-コンテンツセンターである：中心最初のものとALIGN-含量：屈曲端を内部ものを。どちらがうまくいくのですか？

しかし、Flexgridにネイティブに、コンテンツを水平方向と垂直方向の両方に合わせるように指示することができますか？

Answer 1

フレキシボックスと呼ばれるCSS機能があります：

Here is a tutorial

あなたのコードは、この

.div-parent-element { 

    display: flex; /* Make it flexbox */ 
    justify-content: flex-end; /* Align Right */ 
    align-items: center; /* Center Vertically */ 

} 

.div親要素のようになりますが、あなたのテキストが

に含まれているものです