質問編集履歴

3

html部分修正

2017/11/14 04:36

投稿

chibi144
chibi144

スコア64

test CHANGED
File without changes
test CHANGED
@@ -24,19 +24,55 @@
24
24
 
25
25
  ```html
26
26
 
27
- <section style="column-count: 2">
27
+ <!doctype html>
28
28
 
29
- <ol>
29
+ <html lang="ja">
30
30
 
31
- <li>ちくわ</li>
31
+ <head>
32
32
 
33
- <li>大根</li>
33
+ <meta charset="utf-8">
34
34
 
35
- (略)
35
+ <title>test</title>
36
36
 
37
- </ol>
37
+ <link rel="stylesheet" type="text/css" href="test.css">
38
38
 
39
+ </head>
40
+
41
+ <body>
42
+
43
+ <section style="column-count: 2">
44
+
45
+ <ol>
46
+
47
+ <li>ちくわ</li>
48
+
49
+ <li>大根</li>
50
+
51
+ <li>ちくわ</li>
52
+
53
+ <li>大根</li>
54
+
55
+ <li>ちくわ</li>
56
+
57
+ <li>大根</li>
58
+
59
+ <li>ちくわ</li>
60
+
61
+ <li>大根</li>
62
+
63
+ <li>ちくわ</li>
64
+
65
+ <li>大根</li>
66
+
67
+ <li>ちくわ</li>
68
+
69
+ </ol>
70
+
39
- </section>
71
+ </section>
72
+
73
+ </body>
74
+
75
+ </html>
40
76
 
41
77
  ```
42
78
 

2

scssをcssに修正

2017/11/14 04:36

投稿

chibi144
chibi144

スコア64

test CHANGED
File without changes
test CHANGED
@@ -42,53 +42,55 @@
42
42
 
43
43
 
44
44
 
45
- ```scss
45
+ ```css
46
46
 
47
- ol{
47
+ ol {
48
48
 
49
- $size: 25px;
49
+ counter-reset: list;
50
50
 
51
- counter-reset: list;
51
+ min-width: 150px;
52
52
 
53
- min-width: 150px;
53
+ }
54
54
 
55
- li {
56
55
 
57
- position: relative;
58
56
 
59
- height: $size;
57
+ ol li {
60
58
 
61
- line-height: $size;
59
+ position: relative;
62
60
 
63
- margin: 0 0 15px $size;
61
+ height: 25px;
64
62
 
65
- padding-left: 5px;
63
+ line-height: 25px;
66
64
 
67
- }
65
+ margin: 0 0 15px 25px;
68
66
 
69
- li:before {
67
+ padding-left: 5px;
70
68
 
71
- counter-increment: list;
69
+ }
72
70
 
73
- content: counter(list, upper-alpha);
74
71
 
75
- position: absolute;
76
72
 
77
- left: -$size;
73
+ ol li:before {
78
74
 
79
- width: $size;
75
+ counter-increment: list;
80
76
 
81
- height: $size;
77
+ content: counter(list, upper-alpha);
82
78
 
83
- line-height: $size;
79
+ position: absolute;
84
80
 
85
- background: $blue;
81
+ left: -25px;
86
82
 
87
- text-align: center;
83
+ width: 25px;
88
84
 
89
- color: #eee;
85
+ height: 25px;
90
86
 
87
+ line-height: 25px;
88
+
89
+ background: #36479f;
90
+
91
+ text-align: center;
92
+
91
- }
93
+ color: #eee;
92
94
 
93
95
  }
94
96
 

1

画像が入ってなかった

2017/11/14 04:09

投稿

chibi144
chibi144

スコア64

test CHANGED
File without changes
test CHANGED
@@ -16,7 +16,7 @@
16
16
 
17
17
  IEだと以下の画像のように表示されます。
18
18
 
19
- (fc0f6774aa3d9a59f7e1f4ed7d6918c5.png)
19
+ ![IEでの表示例](0772baae194d26e54cade13daadb3397.png)
20
20
 
21
21
 
22
22