質問編集履歴
1
質問を変更いたしました。
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
rails
|
1
|
+
[rails]erbにbootstrapのスタイリングが適応されない
|
test
CHANGED
@@ -1,61 +1,41 @@
|
|
1
|
-
|
1
|
+
bootstrapのcardコンポーネントを使用して画像のスタイルを整えようとしています。
|
2
2
|
|
3
|
+
cardのスタイリングが適応されていればcardにキャプション画像がきれいに収まるはずですが、現在下の画像のようにはみ出てしまっている状態です。
|
4
|
+
|
3
|
-
|
5
|
+
何かご指摘いただければと思います。
|
4
6
|
|
5
7
|
|
6
8
|
|
9
|
+
参考: [https://getbootstrap.com/docs/4.5/components/card/](https://getbootstrap.com/docs/4.5/components/card/)
|
10
|
+
|
7
|
-
![
|
11
|
+
![イメージ説明](59b84fa2fc09fdf615fe742173c4f846.png)
|
12
|
+
|
13
|
+
```ここに言語を入力
|
14
|
+
|
15
|
+
<% @communities.each do |community| %>
|
16
|
+
|
17
|
+
<%= link_to community_path(community) do %>
|
18
|
+
|
19
|
+
<div class="card" style="width: 15rem;">
|
20
|
+
|
21
|
+
<div class="card-image">
|
22
|
+
|
23
|
+
<%= attachment_image_tag community, :intro_image, fallback:"no-image.jpg"; %>
|
24
|
+
|
25
|
+
</div>
|
8
26
|
|
9
27
|
|
10
28
|
|
11
|
-
|
29
|
+
<div class="card-body">
|
12
30
|
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
<index.html.erb>
|
20
|
-
|
21
|
-
```ここに言語を入力
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
<div class="index">
|
26
|
-
|
27
|
-
<%=
|
31
|
+
<%= community.title %>
|
28
|
-
|
29
|
-
<%= link_to community_path(community) do %>
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
<div class="card" style="width: 15rem; height:370px;">
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
<%= attachment_image_tag community, :intro_image, fallback: "no-image-icon_person.jpg", class: "intro_image" %>
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
<div class="card-body">
|
42
|
-
|
43
|
-
<h5 class="card-title"> <%= community.title %> </h5>
|
44
|
-
|
45
|
-
<p class="card-text"> <%= community.user.username %></p>
|
46
|
-
|
47
|
-
</div>
|
48
32
|
|
49
33
|
</div>
|
50
34
|
|
51
|
-
|
35
|
+
</div>
|
52
36
|
|
53
|
-
|
37
|
+
<%end%>
|
54
38
|
|
55
|
-
<%end%>
|
39
|
+
<%end%>
|
56
|
-
|
57
|
-
</div>
|
58
|
-
|
59
|
-
|
60
40
|
|
61
41
|
```
|