Background image overlap using Full Page Intro with a non-fi


Topic: Background image overlap using Full Page Intro with a non-fixed Navbar

Travis W asked 5 years ago

Good evening everyone. I don't have much experience with CSS and my google searches didn't yield any good results. Anyways, I copy and pasted the html and css with no variations for full page intro with a non-fixed navbar.

On desktop everything looks as expected:

enter image description here

However, when I switch to mobile view the background-image seems to overlap the text:

enter image description here

When I expand the toggler the issue gets even worse:

enter image description here

I should also add that when using the live preview on the site everything works as expected.

Thank you for the advice,

Travis


Travis W commented 5 years ago

I figured out a solution! I just took the image out of the header and placed it in the body.


Marta Szymanska staff pro premium answered 5 years ago

Hi,

there is a bug in our example. Thank you for noticing this and inform us. Please, try this code: https://mdbootstrap.com/snippets/jquery/marta-szymanska/1408459#html-tab-view.

Best, Marta


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: Mobile
  • Browser: Chrome / Opera
  • OS: Ubuntu x64
  • Provided sample code: No
  • Provided link: No