Portfolio Project Height Problem

I have a question.

I am working on my portfolio project and I am having some trouble with the height of my elements.

My about section has a green border around it. I currently have the border set to 20px so you can see that it is there. But if I didn’t my about section wouldn’t have any height at all.

How can I set the height of my about section so that it will include all the elements currently in the about section on my html file.


Here is my CodePen

I can’t answer your question but I do have a suggestion. To make your work more professional in appearance always use a serif font what writing text. It keeps the eye engaged. Sans-serif is best for headings.

So, I’m not sure the effect you’re going for but to me it looks like you’ve nested some columns that maybe you didn’t intend to. I always try to put multiple columns that should be aligned horizontally into a row. If the columns are meant to be above/below one another I would try to keep their div’s to the same nesting level. Often I’d even use a row when my column is full width because I think the code just reads better and the layout is somewhat apparent from the structure. If you describe in more detail the desired look or what belongs in your about section and what doesn’t I’d be happy to give you some more guidance.