BootStrap

なんとなくつけたコードで面白かった（いつか役に立つかな？）というコードと実行例
これも追記していこう笑

---

よく分からず使ってた

<div class="container">
</div>

は画面全部（１０割）の７割の間で要素を１２分割（col）できる！！！
これは人が見やすいと思う割合なんだって！！！
へえええ🧐

---

<%= image_tag item.image, class: "mt-3 rounded-circle" %>

可愛いけどサイズ設定してないからデカすぎて死ぬ笑

---

画像を均一な円形にするためには、CSSのborder-radius プロパティを使用する！

<%= image_tag url_for(@user.profile_image), class: "rounded-circle", style: "width: 100px; height: 100px; object-fit: cover;" %>

---

画像が入っている投稿を編集するときに現状の画像が見れたら便利だろうなーと思って、
入力フォームの下に画像をeach文で出力することにした！
あとは編集ページでは小さくてもいいやと思って小さく出力しました。

<div class="form-group">
  <%= form.label :post_images, "カフェ画像" %>
  <%= form.file_field :post_images, accept: "image/*", class: "form-control-file" %>
</div>
        
<% @post.post_images.each do |image| %>
 <%= image_tag url_for(image), class: "img-thumbnail mt-2", style: "width: 90px; height: 90px; object-fit: cover;" %>
<% end %>

今回も'object-fit: cover;'を使って固定してみた！！

---

<small class="text-muted"><%= like_post.address.gsub(/\n/, '<br>').html_safe %></small>

＜　text-muted　＞使うと文字が小さく、グレーになって可愛い。
住所を小さく、かつ段落つけてみた。