Responsiveness Lost

Bootstrap Studio Help
1

I am having an issue with responsiveness, I'm learning Bootstrap and Bootstrap Studio and I've been making a small Bootstrap website for practice and learning purposes. Right now I'm making a banner which from the top level consists of:

  • section
    • div
      • div
        • div
          • h1
            • span
            • span

The section element is the top level of my banner, the first div element is a container, the second div element is a row and the third div element is a column. I have the correct classes (as far as I'm aware) assigned to each element for it to be responsive yet it looks like this:

Project Screengrab

I'm not entirely sure where I've gone wrong, you can see the HTML generated in the screengrab along with all the classes, can someone tell me where I have gone wrong and why I've lost all responsiveness?

Thanks,

Dave.

2

<spans> are inline elements by design.

If you want them to conform to the responsive box model, you have to change their display mode from Default to Block in the Options panel under Responsive Display > Display.