A Section in My HTML is having a problem with its position - html

Question

I have a site and it has 2 sections. the left section is a navigation bar with menus below.
The section next to it is the main section or where the website content must be placed. My problem is the right section is positioned a few pixels from the header. How can i fix this? I provided some image to let you see how the website should look like.
/*WRITTEN USING SASS*/
#side-menu{
margin-top: 25px;
.side-menu-bg {
width: max-content;
h3 {
position: absolute;
color: white;
padding: 0px 18px;
font-size: 27px;
}
img {
display: -webkit-box;
}
}
.side-nav-bar {
width: 210px;
position: unset;
margin-top: -3px;
display: inline-flex;
z-index: 1;
flex-direction: column;
overflow-x: hidden;
background-color: #ffffff;
a {
display: inherit;
color: #707070;
text-decoration: none;
font-size: 15px;
padding: 10px 18px;
position: relative;
border-bottom: 1px solid #e8e8e8;
}
.active-link{
color: #a40022;
border-bottom: 2px solid #8a001c;
}
}
.right-contents {
float: right;
.title h3 {
font-size: 38px;
}
.body-content {
background-color: #d3d3d3;
height: 1094px;
width: 738px;
}
}
}
<div class="wrapper"> <!--to make contents center-->
<div id="side-menu">
<div class="side-menu-bg">
<h3>KU 스타트업</h3>
<img src="images/bg/bg_03.png">
</div>
<div class="side-nav-bar">
인사말
창업 비전
창업 프로세스
창업부서소개
찾아오시는 길
</div>
<div class="right-contents">
<div class="title">
<h3>인사말</h3>
<div class="body-content">
sample text
</div>
</div>
</div>
</div>
</div>

Answer 1

Add margin: 0 to your h3 tag.. h3 has margin-to and margin-bottom by default. thanks
.right-contents {
float: right;
.title h3 {
font-size: 38px;
margin: 0; /*add this*/
}
.body-content {
background-color: #d3d3d3;
height: 1094px;
width: 738px;
}

Answer 2

<style>
/*WRITTEN USING SASS*/
#side-menu{
margin-top: 25px;
.side-menu-bg {
width: max-content;
h3 {
position: absolute;
color: white;
padding: 0px 18px;
font-size: 27px;
}
img {
display: -webkit-box;
}
}
.side-nav-bar {
width: 210px;
position: unset;
margin-top: -3px;
display: inline-flex;
z-index: 1;
flex-direction: column;
overflow-x: hidden;
background-color: #ffffff;
}
a {
display: inherit;
color: #707070;
text-decoration: none;
font-size: 15px;
padding: 10px 18px;
position: relative;
border-bottom: 1px solid #e8e8e8;
}
.active-link{
color: #a40022;
border-bottom: 2px solid #8a001c;
}
}
.right-contents {
width: 65%;
margin-top: -3px;
display: inline-flex;
.title h3 {
font-size: 38px;
}
.body-content {
background-color: #d3d3d3;
height: 1094px;
width: 738px;
}
</style>