質問編集履歴

3

メニューボタン本体のスタイルが抜けていたので追加

2018/07/26 00:26

投稿

aKusano
aKusano

スコア3763

test CHANGED
File without changes
test CHANGED
@@ -54,6 +54,108 @@
54
54
 
55
55
  ```CSS
56
56
 
57
+ /*メニュー本体ボタンスタイル*/
58
+
59
+ .hdMenu_btn {
60
+
61
+ width: 60px;
62
+
63
+ height: 60px;
64
+
65
+ padding: 0;
66
+
67
+ margin: 0;
68
+
69
+ font-size: 10px;
70
+
71
+ line-height: 1;
72
+
73
+ cursor: pointer;
74
+
75
+ }
76
+
77
+
78
+
79
+ .hdMenu_btn .ico {
80
+
81
+ width: 25px;
82
+
83
+ height: 25px;
84
+
85
+ margin: 0 auto 5px;
86
+
87
+ }
88
+
89
+
90
+
91
+ .hdMenu_item.global .hdMenu_btn {
92
+
93
+ background: #7dc6c6;
94
+
95
+ }
96
+
97
+
98
+
99
+ .hdMenu_item.global .ico {
100
+
101
+ position: relative;
102
+
103
+ margin: 2px auto 2px;
104
+
105
+ }
106
+
107
+
108
+
109
+ .hdMenu_item.global .ico span {
110
+
111
+ position: absolute;
112
+
113
+ left: 0;
114
+
115
+ display: block;
116
+
117
+ width: 100%;
118
+
119
+ height: 2px;
120
+
121
+ background: #000000;
122
+
123
+ -webkit-transform-origin: center center;
124
+
125
+ -ms-transform-origin: center center;
126
+
127
+ transform-origin: center center;
128
+
129
+ }
130
+
131
+
132
+
133
+ .hdMenu_item.global .ico span:nth-child(1) {
134
+
135
+ top: 0;
136
+
137
+ }
138
+
139
+
140
+
141
+ .hdMenu_item.global .ico span:nth-child(2) {
142
+
143
+ top: 10px;
144
+
145
+ }
146
+
147
+
148
+
149
+ .hdMenu_item.global .ico span:nth-child(3) {
150
+
151
+ top: 20px;
152
+
153
+ }
154
+
155
+
156
+
157
+ /*アニメーション部分*/
158
+
57
159
  .hdMenu_item.global .ico span:nth-of-type(1) {
58
160
 
59
161
  animation: menu-bar01 .50s forwards;

2

誤字修正

2018/07/26 00:26

投稿

aKusano
aKusano

スコア3763

test CHANGED
File without changes
test CHANGED
@@ -10,7 +10,7 @@
10
10
 
11
11
 
12
12
 
13
- このような崩れ方をするのIE11のバグなのか、
13
+ このような崩れ方をするのIE11のバグのせいなのか、
14
14
 
15
15
  何かコードの書き方がおかしいからなのか分からず困っております。
16
16
 

1

対象箇所のHTMLの不足分を追加

2018/07/25 14:10

投稿

aKusano
aKusano

スコア3763

test CHANGED
File without changes
test CHANGED
@@ -26,6 +26,8 @@
26
26
 
27
27
  ```HTML
28
28
 
29
+ <li id="globalMenu" class="hdMenu_item global">
30
+
29
31
  <button class="hdMenu_btn">
30
32
 
31
33
  <div class="ico">
@@ -41,6 +43,10 @@
41
43
  <div class="txt">MENU</div>
42
44
 
43
45
  </button>
46
+
47
+ --省略--
48
+
49
+ </li>
44
50
 
45
51
  ```
46
52