teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

貼り間違えた

2021/02/09 02:42

投稿

Lhankor_Mhy
Lhankor_Mhy

スコア37488

answer CHANGED
@@ -57,35 +57,35 @@
57
57
 
58
58
  ```css
59
59
  .absolute {
60
- position: relative;
60
+ position: relative;
61
- .overlay {
62
- position: absolute;
63
- top: 0;
64
- bottom: 0;
65
- left: 0;
66
- right: 0;
67
- margin: auto;
68
- }
69
61
  }
62
+ .absolute .overlay {
63
+ position: absolute;
64
+ top: 0;
65
+ bottom: 0;
66
+ left: 0;
67
+ right: 0;
68
+ margin: auto;
69
+ }
70
70
 
71
71
  .negativeMargin {
72
- display: flow-root;
72
+ display: flow-root;
73
- .overlay {
74
- margin-top: -150px;
75
- margin-bottom: 50px;
76
- }
77
73
  }
74
+ .negativeMargin .overlay {
75
+ margin-top: -150px;
76
+ margin-bottom: 50px;
77
+ }
78
78
 
79
79
  .background {
80
- width: 250px;
80
+ width: 250px;
81
- height: 200px;
81
+ height: 200px;
82
- aspect-ratio: 250 / 200;
82
+ aspect-ratio: 250/200;
83
- background-image: url(http://placehold.jp/24/eeeeee/cccccc/250x200.png?text=背景);
83
+ background-image: url(http://placehold.jp/24/eeeeee/cccccc/250x200.png?text=背景);
84
- margin: 0 auto;
84
+ margin: 0 auto;
85
- display: flex;
85
+ display: flex;
86
- align-items: center;
86
+ align-items: center;
87
- .back {
88
- display: none;
89
- }
90
87
  }
88
+ .background .back {
89
+ display: none;
90
+ }
91
91
  ```