はじめに

プログラミング初学者のため、自分の理解できている範囲内で言語化しています。
何か間違っている情報や改善点などありましたら、コメントいただけますと幸いです。🙇‍♂️

今回はRailsでフォームを作るときにハマったことを紹介しています。

1 エラーメッセージ表示によるレイアウトの形崩れ

バリデーションエラーの文言を表示したときに、元のレイアウトが崩れてしまう問題が発生、、、

エラーメッセージを表示するときは、検証するとわかるが、field_with_errorsクラスのdivが現れる。
これによって形崩れしていた😅

他にもあるが、ここではCSSに追記をするだけで良い方法を紹介

.field_with_errors {
  display: contents;
}

これを追記するだけ。

text-areaはデフォの状態では、横と縦にドラッグすることで縮小や拡大が可能だが、
今回の実装の際には左右の縮小はいらなかったので、その抑制方法の紹介

textarea{
  resize: vertical;
}

これで横の縮小を抑制できる

横方向　→　vertical
縦方向　→　horizontal
全方向　→　both デフォでなっている
縮小無　→　none