I’m working on my portfolio page and I have run into an issue that I’m having trouble fixing.
In my about section, I’d like to have my image to the left and text to the right. I’ve gotten that part, however, after the first line my text is wrapping under the image instead of to the right of it. I’ve tried floating the image (which makes it end up in a different part of the page), editing the text’s style (for example overflow:hidden), and nesting it inside a new div, but it is still wrapping underneath.
Here is a link to my page: http://codepen.io/abigailb/pen/rWOKQx?editors=1100
Here is the div in question:
<div> <p><img id="profile-photo" src="https://media.licdn.com/mpr/mpr/shrinknp_200_200/p/7/005/048/272/1774d91.jpg" alt="Photo of Abby" > Abigail Beets is a recent Computer Science graduate and technology enthusiast with a passion for continuous learning and improvement. Skills include Python, Java, HTML5, CSS, SQL, and MongoDB.</p> <hr style="border: none; height: 1px; color: #672F79; background: #672F79; width: 80%;"/> <span>Application Development - Full Stack Web Development - Data Analytics</span> </div>
I’m not new to coding, just to HTML and CSS, but this is throwing me for a loop. Any help is appreciated. Thanks!