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

回答編集履歴

2

修正

2020/05/16 04:50

投稿

m.ts10806
m.ts10806

スコア80888

answer CHANGED
@@ -1,3 +1,15 @@
1
+ こういうときはデベロッパツールで要素を検証します。
2
+ ![イメージ説明](29a484f023b5ee14b377effea8ad5bdc.png)
3
+
4
+ ×のところを選ぼうとするとpが選択されます。
5
+ つまり目には見えないけど被ってるということも言えます。
6
+ `opacity: 0.9;`を削除すると×も選択できるようになり、クリックも効くようになりました。
7
+
8
+ あとは要件次第で工夫してみてください。
9
+
10
+ # 以下、修正前のコードに対する回答
11
+
12
+
1
13
  提示のままのコードだと×は表示されないし、赤い枠のところがそれなら左上ではなく右上ですが
2
14
  ![イメージ説明](ce5821dba3d25acb94ed0360d1fedfdd.png)
3
15
 

1

修正

2020/05/16 04:50

投稿

m.ts10806
m.ts10806

スコア80888

answer CHANGED
@@ -1,4 +1,4 @@
1
1
  提示のままのコードだと×は表示されないし、赤い枠のところがそれなら左上ではなく右上ですが
2
2
  ![イメージ説明](ce5821dba3d25acb94ed0360d1fedfdd.png)
3
3
 
4
- ちょっとマウスポインターの反応範囲狭いですが、ちゃんとクリックできるし、fadeOutが効いて閉じるようになってますよ。
4
+ ちょっとマウスポインターの反応範囲狭いですが、ちゃんとクリックできるし、fadeOutが効いて閉じるようになってますよ。(HTMLの構文ミスを直さなくてもちゃんと閉じます)