Ruby on Railsにbootstrapを入れてサンプルページからテンプレートを持ってきたけど少しずれる。なぜ…？
Ruby on Railsにbootstrapの公式サイトのテンプレートを入れるとずれる
以下の画像のようにHello, world!の部分が少し上にいってしまっていた。
参考にしたサイトはこちら。↓
https://getbootstrap.com/docs/4.1/examples/jumbotron/
bootstrapの設定手順は以下のページ。
Ruby on Railsでbootstrapを使おう！
サンプルとデザインが変わる原因は？
bootstrapもしっかりあたっている。
けど、なぜtopが0まで上がってしまうのか…？
原因はbodyのCSS！
公式のサンプルページではbodyにpadding-top: 3.5remがあたっている。
自分の環境には上記のCSSがない！
これは自分で設定しないといけないよう。
application.scssなり適切な場所に設定が必要。
body{
padding-top: 3.5rem
}
これで解決！
もし、持ってきたテンプレートがずれる場合は
- 該当周辺箇所
- 閉じタグなどが抜けてないか
- 問題なければ更に大枠
を見ていくのが良さそう。
何か参考になれば幸いです。