回答編集履歴

3

tsuiki

2019/11/04 05:14

投稿

kyoya0819
kyoya0819

スコア10429

test CHANGED
@@ -1,68 +1,42 @@
1
1
  ```HTML
2
2
 
3
+ <div class="tata"><div>
3
4
 
5
+ サンプルA<span>100人</span>
4
6
 
5
- <div class="tata">
7
+ </div><div>
6
8
 
7
- <div>
9
+ サンプルA<span>100人</span>
8
10
 
9
- サンプルA
11
+ </div><div>
10
12
 
11
- <span>100人</span>
13
+ サンプルA<span>100人</span>
12
14
 
13
- </div>
15
+ </div><div>
14
16
 
15
- <div>
17
+ サンプルA<span>100人</span>
16
18
 
17
- サンプルA
19
+ </div><div>
18
20
 
19
- <span>100人</span>
21
+ サンプルA<span>100人</span>
20
22
 
21
- </div>
23
+ </div><div>
22
24
 
23
- <div>
24
-
25
- サンプルA
26
-
27
- <span>100人</span>
25
+ サンプルA<span>100人</span>
28
-
29
- </div>
30
-
31
- <div>
32
-
33
- サンプルA
34
-
35
- <span>100人</span>
36
-
37
- </div>
38
-
39
- <div>
40
-
41
- サンプルA
42
-
43
- <span>100人</span>
44
-
45
- </div>
46
-
47
- <div>
48
-
49
- サンプルA
50
-
51
- <span>100人</span>
52
26
 
53
27
  </div>
54
28
 
55
29
  </div>
56
30
 
57
-
58
-
59
31
  ```
60
32
 
61
33
  ```CSS
62
34
 
63
- .tata {
35
+ * {
64
36
 
65
- text-align: center
37
+ margin: 0;
38
+
39
+ padding: 0
66
40
 
67
41
  }
68
42
 
@@ -80,11 +54,13 @@
80
54
 
81
55
  border-radius: 15px 15px 15px 15px;
82
56
 
83
- margin: 5px;
57
+ margin-left: 2.5vw;
84
58
 
85
59
  text-align: center;
86
60
 
87
- padding: 10px
61
+ padding: 10px;
62
+
63
+ box-sizing: border-box
88
64
 
89
65
  }
90
66
 

2

追記

2019/11/04 05:14

投稿

kyoya0819
kyoya0819

スコア10429

test CHANGED
@@ -98,4 +98,4 @@
98
98
 
99
99
  ```
100
100
 
101
- [サンプル](https://codepen.io/asuchi0819/pen/ZEErQNx.css?editors=1100#0)
101
+ [サンプル](https://codepen.io/asuchi0819/pen/ZEErQNx?editors=1100#0)

1

追記

2019/11/04 05:06

投稿

kyoya0819
kyoya0819

スコア10429

test CHANGED
@@ -2,53 +2,53 @@
2
2
 
3
3
 
4
4
 
5
- <div class="row">
5
+ <div class="tata">
6
6
 
7
- <div class="col-sm-4">
7
+ <div>
8
8
 
9
- <div class="mainbox">サンプルA
9
+ サンプルA
10
10
 
11
- <span>100人</span>
11
+ <span>100人</span>
12
-
13
- </div>
14
-
15
- <div class="mainbox">サンプルA
16
-
17
- <span>100人</span>
18
-
19
- </div>
20
-
21
- <div class="mainbox">サンプルA
22
-
23
- <span>100人</span>
24
-
25
- </div>
26
12
 
27
13
  </div>
28
14
 
29
- </div>
15
+ <div>
30
16
 
31
- <div class="row">
17
+ サンプルA
32
18
 
33
- <div class="col-sm-4">
19
+ <span>100人</span>
34
20
 
35
- <div class="mainbox">サンプルA
21
+ </div>
36
22
 
37
- <span>100人</span>
23
+ <div>
38
24
 
39
- </div>
25
+ サンプルA
40
26
 
41
- <div class="mainbox">サンプルA
27
+ <span>100人</span>
42
28
 
43
- <span>100人</span>
29
+ </div>
44
30
 
45
- </div>
31
+ <div>
46
32
 
47
- <div class="mainbox">サンプルA
33
+ サンプルA
48
34
 
49
- <span>100人</span>
35
+ <span>100人</span>
50
36
 
51
- </div>
37
+ </div>
38
+
39
+ <div>
40
+
41
+ サンプルA
42
+
43
+ <span>100人</span>
44
+
45
+ </div>
46
+
47
+ <div>
48
+
49
+ サンプルA
50
+
51
+ <span>100人</span>
52
52
 
53
53
  </div>
54
54
 
@@ -60,11 +60,19 @@
60
60
 
61
61
  ```CSS
62
62
 
63
+ .tata {
63
64
 
65
+ text-align: center
64
66
 
65
- .mainbox {
67
+ }
66
68
 
69
+ .tata div {
70
+
71
+ width: 30vw;
72
+
73
+ display: inline-block;
74
+
67
- font-size: 80%;
75
+ font-size: 70%;
68
76
 
69
77
  font-weight: 900;
70
78
 
@@ -76,17 +84,17 @@
76
84
 
77
85
  text-align: center;
78
86
 
87
+ padding: 10px
88
+
79
89
  }
80
90
 
81
- .mainbox span{
91
+ .tata div span{
82
92
 
83
93
  display: block;
84
94
 
85
- font-size:120%
95
+ font-size:150%
86
96
 
87
97
  }
88
-
89
-
90
98
 
91
99
  ```
92
100