Unable to Scroll web Page

Hi folks,

Brand new to Bootstrap, so some dumb questions, no doubt.

I have just made a simple page - hero, three cards below it and then 3 or 4 paragraphs.

The problem is that when I preview or even publish the page, it will not allow me to scroll at all. The hero image stays stubbornly still.

Any ideas what I’m missing out?


Is this happening on Mobile or through a browser?

Also, do you have it uploaded through a [domain].bss.design page we may visit to review the dev tools to see if we may assist? I’ve had similar issues, but had to review that in order to fix the issue.

It’s happening in the browser (Firefox) and it’s uploaded to train2enable.bss.design.

There’s a fundamental layout error. Somehow you have placed all the content on your site inside the Parallax Background component (I presume this was unintentional.)

The Parallax Background component has a fixed height of 600px (set via an inline CSS style.) This is why you cannot see your cards, or the text below them, or scroll the page.

You need take everything out of the Parallax Background and put it where it belongs.

Brilliant. I knew it would be something dumb. And I was beginning to feel it was behaving as though it were a single object. I’ll do as you suggest. Many thanks, indeed.

That worked. Thank you very much. It’s just that it’s not too clear what’s inside what when you’re not used to the interface. Makes perfect sense, though.

In many cases, it’s easier to add page components by dragging them into the Overview Panel (in the lower left), rather than on to the page itself. You can always see where things “are” by expanding the various sections and containers and divs in the Overview panel. From there you can drag them in and out of each other, and reorder them on the page a lot faster and easier than if you try to do it in the workspace. It just takes some getting used to.