回答編集履歴
2
説明追記
test
CHANGED
|
@@ -103,3 +103,13 @@
|
|
|
103
103
|
ただ、スクロールバーの幅はブラウザやOSで異なる可能性があるのでその辺は検証してください。
|
|
104
104
|
|
|
105
105
|
上記のコードは Windows の Chrome に合わせてます。
|
|
106
|
+
|
|
107
|
+
|
|
108
|
+
|
|
109
|
+
floatだと幅を狭くして折り返された時、高さが揃わない。
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
|
|
113
|
+
flexだと揃う。
|
|
114
|
+
|
|
115
|
+
|
1
コードにコメント追記
test
CHANGED
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
|
|
57
57
|
tr {
|
|
58
58
|
|
|
59
|
-
display: flex;
|
|
59
|
+
display: flex; /* 横並び */
|
|
60
60
|
|
|
61
61
|
}
|
|
62
62
|
|
|
@@ -66,19 +66,7 @@
|
|
|
66
66
|
|
|
67
67
|
display: block;
|
|
68
68
|
|
|
69
|
-
width: Calc(100% - 20px);
|
|
69
|
+
width: Calc(100% - 20px); /* スクロールバーの幅を引く */
|
|
70
|
-
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
tbody {
|
|
76
|
-
|
|
77
|
-
overflow-x: hidden;
|
|
78
|
-
|
|
79
|
-
overflow-y: scroll;
|
|
80
|
-
|
|
81
|
-
height: 100px;
|
|
82
70
|
|
|
83
71
|
}
|
|
84
72
|
|