So I am working on presonal portfolio projects and i found this wierd space between sections and don’t know how to remove it
link to my code:
Link to my code
I corrected it by adding a margin of 0px to the #projects h2 element.
If you delete the <h2>My projects</h2> within the div, you’ll notice the white section disappears.
#projects h2 {
font-size: 3rem;
display: flex;
justify-content: center;
border-bottom:1px solid tomato;
margin:0px;
Hey thanks for the help!!
I removed <h2>My projects</h2> and <div id="main></div> then added <header>My projects</header> and that removed the white space.
and i also noticed that when i click projects in navigation bar in take me to the corresponding page but my header “My projects” in that section isn’t shown
and it looks like this.
Could you help me with this problem??
This solution works, but I don’t know if it’s the best method to correct the disappearing title. You can add a padding of 50-70px to the top. But it’s not as visually appealing.
I think there must be a better way.
#projects {
background-color: #120E43;
color: #FF6263;
padding-top: 60px;
}
Thanks again for helping me.
I changed the code little bit and got this as a final result.
Now I think the little space above header will not be as bad looking.
I also noticed that Freecodecamp protfolio example was using the same technique to fix that problem.
1 Like
It’s a good design solution to a technical problem.