Hello,
I’m 28% into the full stack path. Loving the course and learning a lot!
Link to portfolio website: My Portfolio
I’ve created my portfolio website, with some inspiration from Spumoni ice cream and the Lovelace example. I learned how to add Fontawesome fonts to my site, added a tiny bit of javascript with the “read more” buttons (still working on that), and used some responsive design for screen sizes.
This was a fun and useful project, which took about 2 days to complete.
Can you please help me with something, though? The project images are not aligned to the top of the container, and I’m not sure how to do it. The images are not spaced correctly either. I used “space around” but they’re hanging to the left. I used flex boxes, and it’s sort of successful but not 100%. Your help is appreciated.
By the way, I didn’t make a separate contact page but instead put the contact section at the bottom.
Your feedback is much appreciated.
Sandy
Hello!
It looks like your project thumbnails are in a div with an id of projects=container. If you made this div a flexbox container, you could then align the items to the top using align-items: start. This property determines how items are aligned on their cross-axis. Here is a really cool tutorial on this property with some good visual examples.
To get them to align horizontally within the container, you can use the related justify-content property, which aligns items in a container on their main-axis. Here is a tutorial on that property, from the same source, which again has really clear visual examples.
I often use this latter property for the header / nav bar section, when I want a logo to align to the left, and an unordered list of links to align to the right. You would achieve this look using justify-content: space-between. If you apply this rule-set to your nav section, you will see what I mean.
I hope this is what you were looking for. I’m sure there are a million other ways to achieve the look you want. By the way, your portfolio looks awesome 