As inferred from the problem statement, you needed to have an html/css layout for the rows and columns inside the image given, so I have tried achieving a layout that may help serve your broader purpose. You may also refer to the codepen link: https://codepen.io/Gritika190694/pen/vYGVNPM
.container{
font-size: 24px;
font-family: arial,sans-serif,helvetica;
text-align: center;
}
.topmost{
display: grid;
grid-template-columns: 50% 50%;
}
.topmost > .left{
grid-row: 1 / span 2;
background-color: skyblue;
height: 150px;
}
.topmost > .right-top{
background-color: orangered;
height: 75px;
}
.topmost > .right-bottom{
background-color: orange;
height: 75px;
}
nav > ul{
display: flex;
justify-content: space-evenly;
align-items: center;
list-style-type: none;
background-color: #eeeeee;
margin: 0;
height: 50px;
}
.below-nav{
display: grid;
grid-template-rows: 150px 150px;
}
.below-nav > .top {
background-color: #a4a4a4;
color: #ffffff;
}
.below-nav > .bottom{
background-color: goldenrod;
}
.cards-wrapper{
display: grid;
grid-template-columns: auto auto auto;
grid-template-rows: 100px 100px;
}
.card:nth-child(even){
background-color: #cccccc;
}
.card:nth-child(odd){
background-color: skyblue;
}
.bottommost{
height: 50px;
background-color: #a6a6a6;
display: flex;
align-items: center;
justify-content: center;
}
.bottommost > a:link,
.bottommost > a{
text-decoration: none;
color: #ffffff;
}
<html>
<body>
<div class="container">
<div class="topmost" id="topmost">
<div class="left">We got you covered</div>
<div class="right-top">Learn More</div>
<div class="right-bottom">
Join now
</div>
</div>
<nav>
<ul>
<li>Home</li>
<li>About</li>
<li>Services</li>
<li>Contact</li>
</ul>
</nav>
<div class="below-nav">
<div class="top">Your Personal Finnancial safety net online</div>
<div class="bottom">About Us</div>
</div>
<div class="cards-wrapper">
<div class="card">01</div>
<div class="card">02</div>
<div class="card">03</div>
<div class="card">04</div>
<div class="card">05</div>
<div class="card">06</div>
</div>
<div class="bottommost"><a href="#topmost">Scroll To Top</a></div>
</div>
</body>
</html>