Full width, full height for a row?

I’d like my front page to have it’s first row full width, full height.

It would be even better if this row appeared above the header and the page scrolled down till the header was anchored…

Is this possible? Can’t see how with the standard theme, anyone successfully achieved it with a child theme and willing to share the knowledge? :o)

Andy

P.S. Have searched, couldn’t find anything…

I should add I can do this in CSS (height:100%) and creating a custom module is probably the way to go?

Hey Andrew,

Welcome to the BB forums! :slight_smile:

You should be able to style it with height: 100vh; and it should make it use the entire height of the device’s viewport.

Instead of making the first row appear above the header, you might just want to use a No Header/Footer template on that page and do everything via Page Builder.

Hope this helps!

Ben

Ben

Thanks for the reply - really appreciated it!

In my child theme added your suggestion in the appropriate way then added - tried a class and an ID just for the heck of it in Advanced for the Row and tried each: no joy.

Tried height: 100%; instead then got nowhere…

Hmmm…I’m turning into a newbie in my old age…

Andrew

Hey Andrew,

Do you mind sending in the URL of the site you are working on so I can check?

Ben

Hi Ben

Am working on the page currently, so have removed the call to class/ID but it’s there in the child style.css.

http://bentlebury.net/website-builder-and-enhanced-seo-tools

Hey Andrew,

Try placing a class on the first row of your page then use this CSS snippet. In this example, the class on the first row is first-row.

.first-row .fl-row-content-wrap {
  height: 100vh;
}

Ben