質問編集履歴

5

一部変更

2020/07/15 06:37

投稿

keisuke.F
keisuke.F

スコア19

test CHANGED
File without changes
test CHANGED
@@ -6,8 +6,6 @@
6
6
 
7
7
  マウスオーバーするとliタグが表示されるようになったのですが、tableの高さが変わったり、アイコンの位置がずれてしまいます。
8
8
 
9
- そこでposition: relative;を付与するもどこにおいても反応しないです。(エラーが出てしまったりします)
10
-
11
9
  spanタグをtd内に記述していることが原因でしょうか。
12
10
 
13
11
  しかし、td外にspanを書くとエラーが出ます。

4

一部変更

2020/07/15 06:37

投稿

keisuke.F
keisuke.F

スコア19

test CHANGED
File without changes
test CHANGED
@@ -104,8 +104,6 @@
104
104
 
105
105
  tbody {
106
106
 
107
- position: relative;
108
-
109
107
  tr {
110
108
 
111
109
  border-bottom: 2px dashed #87CEFA;
@@ -114,8 +112,6 @@
114
112
 
115
113
  span {
116
114
 
117
- position: absolute;
118
-
119
115
  }
120
116
 
121
117
  :hover ul{
@@ -130,18 +126,26 @@
130
126
 
131
127
  li {
132
128
 
133
- text-decoration: none;
134
-
135
- margin: 2em auto;
129
+ margin: 1em auto;
136
-
137
- color: #666666;
138
130
 
139
131
  background-color: #f7f7f7;
140
132
 
141
- border: 2px solid #ccc;
133
+ border-left: 1px solid #d8d8d8;
134
+
135
+ border-right: 1px solid #d8d8d8;
136
+
137
+ box-shadow: 1px 2px 5px rgba(0,0,0,0.1);
142
138
 
143
139
  border-radius: 4px;
144
140
 
141
+ a {
142
+
143
+ text-decoration: none;
144
+
145
+ color: #666666;
146
+
147
+ }
148
+
145
149
  }
146
150
 
147
151
  }
@@ -190,8 +194,6 @@
190
194
 
191
195
  }
192
196
 
193
-
194
-
195
197
  }
196
198
 
197
199
  }

3

一部変更

2020/07/15 06:34

投稿

keisuke.F
keisuke.F

スコア19

test CHANGED
File without changes
test CHANGED
@@ -8,9 +8,9 @@
8
8
 
9
9
  そこでposition: relative;を付与するもどこにおいても反応しないです。(エラーが出てしまったりします)
10
10
 
11
- spantd内に記述していることが原因でしょうか。
11
+ spanタグをtd内に記述していることが原因でしょうか。
12
-
12
+
13
- しかし、table外にspanを書くとエラーが出ます。
13
+ しかし、td外にspanを書くとエラーが出ます。
14
14
 
15
15
  何か良い方法はないでしょうか。
16
16
 

2

一部変更

2020/07/15 06:22

投稿

keisuke.F
keisuke.F

スコア19

test CHANGED
File without changes
test CHANGED
@@ -6,6 +6,8 @@
6
6
 
7
7
  マウスオーバーするとliタグが表示されるようになったのですが、tableの高さが変わったり、アイコンの位置がずれてしまいます。
8
8
 
9
+ そこでposition: relative;を付与するもどこにおいても反応しないです。(エラーが出てしまったりします)
10
+
9
11
  spanとtd内に記述していることが原因でしょうか。
10
12
 
11
13
  しかし、table外にspanを書くとエラーが出ます。

1

内容の一部変更

2020/07/15 06:21

投稿

keisuke.F
keisuke.F

スコア19

test CHANGED
File without changes
test CHANGED
@@ -4,11 +4,13 @@
4
4
 
5
5
 
6
6
 
7
- アイコンをホバーすると”編集”、”削除”と表示されるようにのですが苦戦中です。
7
+ マウスオーバーするとliタグが表示されるようになったのですが、tableの高さが変わったり、アイコンの位置がずれてしまいます。
8
+
8
-
9
+ spanとtd内に記述していることが原因でしょうか。
9
-
10
-
10
+
11
- 調べて実装するも状況は変わらず検討付かなくなりした
11
+ しかしtable外にspanを書くとエラー
12
+
13
+ 何か良い方法はないでしょうか。
12
14
 
13
15
 
14
16
 
@@ -88,6 +90,8 @@
88
90
 
89
91
  width: 60%;
90
92
 
93
+ height: 100vh;
94
+
91
95
  margin: 0 auto;
92
96
 
93
97
  thead {
@@ -98,6 +102,8 @@
98
102
 
99
103
  tbody {
100
104
 
105
+ position: relative;
106
+
101
107
  tr {
102
108
 
103
109
  border-bottom: 2px dashed #87CEFA;
@@ -106,10 +112,20 @@
106
112
 
107
113
  span {
108
114
 
115
+ position: absolute;
116
+
109
117
  }
110
118
 
119
+ :hover ul{
120
+
121
+ display: block;
122
+
123
+ }
124
+
111
125
  ul {
112
126
 
127
+ display: none;
128
+
113
129
  li {
114
130
 
115
131
  text-decoration: none;
@@ -172,6 +188,8 @@
172
188
 
173
189
  }
174
190
 
191
+
192
+
175
193
  }
176
194
 
177
195
  }