I'm trying to horizontally align two block elements and "display: inline-block" isn't working. I'm wondering if this is because I have unique margins set for each element. I don't understand CSS from a theoretical level. I will be adding a line to connect them visually once they're on the same horizontal line.
h2 {
padding: 75px;
margin-left: 30px;
font-family: 'Nunito Sans', sans-serif;
}
#cal {
font-family: 'Roboto', sans-serif;
border: solid;
border-radius: 25px;
padding: 10px;
margin-left: 350px;
margin-right: 250px;
}
<h2 id="#about-me">About Me</h2>
<p id="cal">My name is Cal. I'm 28 years old and live in Boston, Massachusetts. I'm from NYC originally. I'm passionate about web design and SEO. I built this site to feature my work.</p>