CLICK HERE TO SEE WHAT IT LOOKS LIKE RIGHT NOW!!!
(had to hide my name and face for privacy names in the picture and censor my name in the html)
1. So basically I was wondering how I could put the text and the image in two separate columns side by side?
2. Also, I don't know how to remove that space between the header and main part. I'm sorry if this seems ridiculous.
HTML (not all of it, just the important part):
<h4>My Portfolio</h4><nav><ul><li><a href="Home.html">Home</a></li><li><a href="Education.html">Education</a></li><li><a href="About Me.html">About Me</a></li><li><a href="Contact.html">Contact</a></li></ul></nav>
<div class="intro"><p><b>Hi!</b><br> My name is <b>insert my name here</b> and I am a first year <b>computer science</b> student.</p><img src="Me.jpg" alt="A picture of me in front of pink flowers" width="500" height="500"></div>
CSS:
body{margin-left: 10%; margin-right: 10%; margin-top: 2em;}header{ font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;}h4{ padding: 20px;}.wrapper{ background-color: #a989d6; display: flex; align-items: center; justify-content: space-between; }nav ul{ list-style-type: none;}nav a{ text-decoration: none; padding: 20px;}nav li{ display: inline;}.intro{ text-align: center; align-items: center;}main{ background-color: #dfcff6;}footer{ background-color: #a989d6; text-align: center; padding: 20px; font-style: italic;}