I'm currently facing a challenge while working on the personal portfolio webpage project for freecodecamp. Everything looks good except for one issue.
Although I have managed to center align my heading and paragraph text as intended, the paragraph text seems to be ignoring the <p>
element altogether.
I tried adding a break line but it didn't help. Any assistance with this problem would be greatly appreciated before I proceed further with completing this task.
body {
background-color: #0d3d95;
}
.welcome-section {
display: flex;
flex-diection: column;
justify-content: center;
align-items: center;
width: 100%;
height: 100vh;
}
#projects {}
h1 {
font-family: monospace;
font-size: 16px;
color: white;
text-align: center;
}
p {
font-size: 20px;
color: white;
}
#navbar {}
a {
color: white;
text-decoration: none;
font-family: helvetica;
}
ol {
display: inline;
}
.nav {
display: flex;
justify-content: flex-end;
position: fixed;
top: 0;
left: 0;
width: 100%;
background: #8524e9;
border-bottom: 5px solid #042574;
}
<!--nav section-->
<nav id="navbar" class="nav">
<ul>
<ol> <a href="#">About<a/></ol>
<ol> <a href="#">Contact<a/></ol>
<ol> <a href="#">Projects<a/></ol>
</ul>
</nav>
<!--End nav section-->
<!--Welcome Section Start-->
<section id="welcome-section" class="welcome-section">
<h1>Hey I am Mimic</h1>
<p>a web developer</p>
</section>
<!--Welcome Section End-->
<section id="projects">
</section>