hero page with registration form

Hi there,

The header element should be what you are looking for:
https://docs.generatepress.com/article/header-element-overview/

You can see some examples here:
https://docs.generatepress.com/article/page-hero-examples/

Also some step by step guide:
https://docs.generatepress.com/article/how-to-create-a-page-hero/

Let me know if this helps :)

Thank You Leo :-)
I had already seen the tutorials but how do I divide the space into 2 containers?

Try the flexbox method similar to this article here:
https://docs.generatepress.com/article/split-header-three-sections/

Just need to make it 2 <div> with width: 50%;

Let me know if this helps :)

Hi there,

try this for your HTML

<div class="hero-grid">
    <div class="hero-grid-container">
     <!-- Your top left hmtl -->
    </div>
    <div class="hero-grid-container">
     <!-- Your bottom right hmtl -->
    </div>
</div>

and this CSS:

@media (min-width: 769px) {
    .hero-grid {
        display: flex;
    }
    .hero-grid-container {
        flex: 1 0 50%;
        padding: 20px;
        box-sizing: border-box;
    }
}