Move content up a full-screen or hero bloc

As per the heading, on desktops full-screens and heroes can look great.

But, on smaller devices the content can appear too far down the screen, especially when the nav overlays are present.

So, is there a way of keeping content towards the tops of full-screens and heroes?

I normally start with a full-screen bloc and then add the content I want. I then create a class for the bloc and you can adjust just the top & bottom margin on each breakpoint. This will let you control how much white space you want on each device.


Yep, that’s what I tried but with margin and padding set to zero - be it container, row or column - it’s still way too low. And negative values aren’t allowed.

Are your sidebar padding settings set to “none”?


No, because then it wouldn’t be a full-screen bloc.

I want the bloc to be full-screen. But to move the content up.

Or are you suggesting there’s an alternative means to setting the bloc to be full-screen?

Not to have it auto fill the screen, but I find most of the time I just control this using the top and bottom padding.

Using the Hero you should be able to move the current content up by using a negative top margin just the top photo.


Well thanks - I tried adding a negative pad and margin but it wasn’t accepted. But now it is. Who knew?

Problem solved!

Glad it worked.