回答編集履歴
2
コード修正
answer
CHANGED
|
@@ -6,10 +6,10 @@
|
|
|
6
6
|
position: relative;
|
|
7
7
|
}
|
|
8
8
|
.workstyle-copy-title {
|
|
9
|
-
|
|
9
|
+
position: absolute;
|
|
10
10
|
top: 50%;
|
|
11
|
-
|
|
11
|
+
left: 50%;
|
|
12
|
-
transform: translate(50%, 50%);
|
|
12
|
+
transform: translate(-50%, -50%);
|
|
13
13
|
}
|
|
14
14
|
```
|
|
15
15
|
|
1
説明の改善
answer
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
下記のCSSの追加でどうでしょう。
|
|
2
|
-
[https://koukoku-unyou.com/recruit/](https://koukoku-unyou.com/recruit/) で検証ツールてCSSを追加して動作確認済みです。
|
|
2
|
+
[https://koukoku-unyou.com/recruit/](https://koukoku-unyou.com/recruit/) で検証ツールにてCSSを追加して動作確認済みです。
|
|
3
3
|
|
|
4
4
|
```css
|
|
5
5
|
.workstyle-copy-wrap {
|
|
@@ -14,4 +14,6 @@
|
|
|
14
14
|
```
|
|
15
15
|
|
|
16
16
|
下記の6番目のtransformを使った方法です。
|
|
17
|
-
[CSSで要素を上下や左右から中央寄せする7つの方法 | 株式会社グランフェアズ](https://www.granfairs.com/blog/staff/centering-by-css)
|
|
17
|
+
[CSSで要素を上下や左右から中央寄せする7つの方法 | 株式会社グランフェアズ](https://www.granfairs.com/blog/staff/centering-by-css)
|
|
18
|
+
|
|
19
|
+
今回のように複数のブロック(video と workstyle-copy-title)がある場合は、Flexではうまくいかない。
|