質問編集履歴

2

タイトル変更

2021/03/22 08:03

投稿

u-sukesan
u-sukesan

スコア160

test CHANGED
@@ -1 +1 @@
1
- CSS floatの横並び要素を中央寄せにしたい
1
+ CSS 横並び要素を中央寄せにしたい
test CHANGED
File without changes

1

html記述変更

2021/03/22 08:03

投稿

u-sukesan
u-sukesan

スコア160

test CHANGED
File without changes
test CHANGED
@@ -8,6 +8,88 @@
8
8
 
9
9
  ```ここに言語を入力
10
10
 
11
+
12
+
13
+ <!DOCTYPE html>
14
+
15
+ <html lang="ja"><head>
16
+
17
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
18
+
19
+ <meta http-equiv="Content-Language" content="ja">
20
+
21
+ <meta http-equiv="content-script-type" content="text/javascript"/>
22
+
23
+ <meta http-equiv="content-style-type" content="text/css"/>
24
+
25
+ <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
26
+
27
+ <head>
28
+
29
+ <title>タイトル</title>
30
+
31
+ <style>
32
+
33
+ ul.icons{
34
+
35
+ margin: 0;
36
+
37
+ padding: 0;
38
+
39
+ text-align: center;
40
+
41
+ list-style: none;
42
+
43
+ }
44
+
45
+ ul.icons::after{
46
+
47
+ display: block;
48
+
49
+ content: " ";
50
+
51
+ clear: both;
52
+
53
+ }
54
+
55
+ ul.icons li{
56
+
57
+ display: inline-block;
58
+
59
+ padding: 0;
60
+
61
+ margin: 0;
62
+
63
+ }
64
+
65
+
66
+
67
+ ul.col3 li{
68
+
69
+ width: calc(100% /3);
70
+
71
+ }
72
+
73
+
74
+
75
+ ul.col4 li{
76
+
77
+ width: calc(100% /4);
78
+
79
+ }
80
+
81
+ ul.icons li img{width: 100%;}
82
+
83
+
84
+
85
+ </style>
86
+
87
+ </head>
88
+
89
+
90
+
91
+ <body>
92
+
11
93
  <ul class='icons col3'>
12
94
 
13
95
  <li><img src='アイコン' width='100%'></li>
@@ -20,8 +102,6 @@
20
102
 
21
103
  <li><img src='アイコン' width='100%'></li>
22
104
 
23
- ・・・・
24
-
25
105
  </ul>
26
106
 
27
107
 
@@ -38,10 +118,12 @@
38
118
 
39
119
  <li><img src='アイコン' width='100%'></li>
40
120
 
41
- ・・・・
42
-
43
121
  </ul>
44
122
 
123
+ </body>
124
+
125
+ </html>
126
+
45
127
  ```
46
128
 
47
129