HTML & CSS Content stuck at bottom of section?

[jtek.679]

Hello so I have this seciont but all the content from the section is appearing at the very bottom of the section. Any way to move it up to the top? It looks really bad since there is just huge empty space between this section and the one above.

Thank you so much 🙂

[CODE lang="html" title="html"]<section class="app" id="app">
<div class="max-width">
<h2 class="title"><span class="typing-2"></span></h2>
<div class="app-content">
<div class="column left">
<img src="img/applewatch.jpg" alt="">
</div>
<div class="column right">
<p> ............................... </p>
</div>
</div>
</div>
</section>[/CODE]

[CODE lang="css" title="CSS"].app .title::after{
content: "app integration"
}


.app .app-content{
display: flex;
padding-top: 50px;
}

.app .app-content .left{
width: 45%;
}

.app .app-content .left img{
height: 400px;
width: 400px;
object-fit: cover;
border-radius: 6px;
}

.app .app-content .right{
width: 55%;
}

.app .app-content .text{
font-size: 25px;
font-weight: 600;
margin-bottom: 100px;
}

.app .title span{
color: green;
}

.app .app-content .right p{
text-align: justify;
}[/CODE]

 

[Malcolm]

Hey there,

If you tried removing the padding-top: 50px from the code below, does that fix it?

.app .app-content{
    display: flex;
    padding-top: 50px;
  }