Наложение эффекта параллакса и Bootstrap не выравнивает div

Совсем новичок в веб-разработке. Я пытаюсь сделать отзывчивый сайт для мобильных и настольных компьютеров. Скажу честно, сейчас он ужасен. Но я работаю над ним. В настоящее время у меня есть 2 основные проблемы, с которыми я борюсь уже целый день. Также да, я использую django на backend и vue как cdn на front.

  1. I have deployed rellax js into the website for a paralax effect however its creating an ugly overlap and I can't seem to get ride of it.
  2. Once I deployed rellax js my text that was supposed to be center of the landing page disappeared to the bottom. I would like it centered. Could anyone help me with these issues? Also any input as to how to make this mobile friendly would be awesome, I was just going to lock the images at a certain size if the screen was small.

HTML

Изображение 1 enter image description here

Изображение 2 после прокрутки вниз

enter image description here

Как вы можете видеть, фоновое изображение, которое прокручивается, выскакивает с другой стороны и выглядит отвратительно. Есть идеи, как это исправить?

Вы также видите, что about btn и txt находятся внизу, а не сверху и не по центру, как я пытаюсь их разместить.

Любая помощь была бы удивительной!!!

Вернуться на верх