回答編集履歴

1

コード追記

2020/04/18 15:49

投稿

hatena19
hatena19

スコア33795

test CHANGED
@@ -75,3 +75,47 @@
75
75
  }
76
76
 
77
77
  ```
78
+
79
+
80
+
81
+ 蛇足
82
+
83
+ ---
84
+
85
+ 疑似チェックボックスの配置ですが、現状は `position: absolute;` と `transform` で位置決めしてますが、flex を使うとシンプルにできます。
86
+
87
+
88
+
89
+ ```scss
90
+
91
+ span {
92
+
93
+ font-size: 1.6rem;
94
+
95
+ font-weight: normal;
96
+
97
+ cursor: pointer;
98
+
99
+ display: inline-flex; /*横並び*/
100
+
101
+ align-items: center; /*垂直位置中央配置*/
102
+
103
+ &::before {
104
+
105
+ content: "";
106
+
107
+ width: 28px;
108
+
109
+ height: 28px;
110
+
111
+ background: #fff;
112
+
113
+ border: 1px solid rgba(0, 0, 0, 0.16);
114
+
115
+ border-radius: 2px;
116
+
117
+ margin-right: 10px; /*a要素との間隔調整*/
118
+
119
+ }
120
+
121
+ ```