回答編集履歴

2

書体の影響を少し調整

2015/05/11 09:29

投稿

webnohito
webnohito

スコア88

test CHANGED
@@ -26,11 +26,41 @@
26
26
 
27
27
  <style>
28
28
 
29
+ /*---------------------------------------
30
+
31
+ Reset
32
+
33
+ ----------------------------------------*/
34
+
35
+ html, body, ol, li {
36
+
37
+ font-size:100%;
38
+
39
+ }
40
+
41
+
42
+
43
+ body {
44
+
45
+ font-family:"メイリオ", "ヒラギノ角ゴ Pro W3", "MS Pゴシック",Verdana, Arial, Helvetica, sans-serif;
46
+
47
+ font-size:13px;
48
+
49
+ *font-size:small;
50
+
51
+ *font:x-small;
52
+
53
+ font-size:small\9;
54
+
55
+ line-height:1.5;
56
+
57
+ }
58
+
29
59
  ol{
30
60
 
31
61
  margin:0 auto;
32
62
 
33
- width:200px;
63
+ width:180px;
34
64
 
35
65
  counter-reset:number;
36
66
 
@@ -52,17 +82,13 @@
52
82
 
53
83
  ol li::before{
54
84
 
55
- margin-right:5px;
56
-
57
- padding:1px;
58
-
59
85
  border:1px solid #333;
60
86
 
61
87
  border-radius:50%;
62
88
 
63
- display:inline-block;
89
+ width:1.5em;
64
90
 
65
- width:1em;
91
+ height:1.5em;
66
92
 
67
93
  counter-increment:number;
68
94
 
@@ -119,5 +145,3 @@
119
145
  </html>
120
146
 
121
147
  ```
122
-
123
-

1

※2行になるパターンを考えてちょびっと修正しました。

2015/05/11 09:29

投稿

webnohito
webnohito

スコア88

test CHANGED
@@ -36,13 +36,17 @@
36
36
 
37
37
  list-style:none;
38
38
 
39
+ list-style-position:outside;
40
+
39
41
  }
40
42
 
41
43
  ol li{
42
44
 
43
- padding:5px;
45
+ padding:5px 5px 5px 1.5em;
44
46
 
45
47
  border-bottom:1px dotted #CCC;
48
+
49
+ position:relative;
46
50
 
47
51
  }
48
52
 
@@ -68,7 +72,9 @@
68
72
 
69
73
  font-size:75%;
70
74
 
71
- vertical-align:text-bottom;
75
+ position:absolute;
76
+
77
+ left:0;
72
78
 
73
79
  }
74
80
 
@@ -104,6 +110,8 @@
104
110
 
105
111
  <li>マヒャデドス</li>
106
112
 
113
+ <li>返事がない、ただの屍のようだ。</li>
114
+
107
115
  </ol>
108
116
 
109
117
  </body>
@@ -111,3 +119,5 @@
111
119
  </html>
112
120
 
113
121
  ```
122
+
123
+