DEV Community

Discussion on: Your feedback on my website portfolio!

markel profile image
Markel F.

Definitely, responsiveness is probably #1 priority on web development nowadays. Flexbox and the wrap attribute should help in My Projects section.

With a flexbox generator I did a little piece of CSS that you can apply to the parent element. This should give the same effect of what you have, but wrapping it in mobile devices.

display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;

Feel free of tweaking the design, especially concerning about spacing, I leave you the template of my preferred generator it to be easier.

Also, I recommend you to add this tag to your <head> element, you will discover how magical it is when you add it.

<meta name="viewport" content="width=device-width, initial-scale=1.0>

Good luck with it, and I really like the website. If you need anything else, send me a message 😊.

saraahmed626 profile image
Sara °°° Author

Markel :) Thank you so much for the valuable information, sure will ask for your help if anything stops in the way :D