回答編集履歴

3 flex使わずシンプルに

kszk311

kszk311 score 3300

2018/04/03 17:49  投稿

やり方はいくつかありますが、flexを使った方法です。
```css
   .recruitment p{
       position: absolute;
       font-weight: bold;
       color: black;
       font-size: 7vmin;
       font-family: meiryo;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       margin: 0;
       display: -webkit-flex;
       display: flex;
       justify-content: center;
       align-items: center;
       margin: 50px 0 0;
       text-align: center;
       /* ↓追加分 */  
       padding-top: 50px;  
       -webkit-box-sizing: border-box;  
       box-sizing: border-box;  
   }
```
```
2 修正

kszk311

kszk311 score 3300

2018/04/03 17:45  投稿

やり方はいくつかありますが、flexを使った方法です。
```css
   .recruitment p{
       position: absolute;
       font-weight: bold;
       color: black;
       font-size: 7vmin;
       font-family: meiryo;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       margin: 0;
       display: -webkit-flex;
       display: flex;
       justify-content: center;
       align-items: center;
       text-align: center;
       /* ↓追加分 */  
       padding-top: 50px;  
       -webkit-box-sizing: border-box;  
       box-sizing: border-box;  
   }
```
1 text-align: center;追加

kszk311

kszk311 score 3300

2018/04/03 17:20  投稿

やり方はいくつかありますが、flexを使った方法です。
```css
   .recruitment p{
       position: absolute;
       font-weight: bold;
       color: black;
       font-size: 7vmin;
       font-family: meiryo;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       margin: 0;
       display: -webkit-flex;
       display: flex;
       justify-content: center;
       align-items: center;
       text-align: center;  
   }
```

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る