How to use flexbox

Im Having a Problem, with flex.
I am trying to finish, my portfolio page. I want to put my images and links in a container like one left one right and so on.

First, we would need a link to your code so we can see what you’ve done so far.

Second, I highly recommend you read A Complete Guide to Flexbox. It truly is one of the best flexbox resources available.

2 Likes

AHHHH youy beat me to it.
Seconded the A Complete Guide to Flexbox | CSS-Tricks - CSS-Tricks is a great visual guide on flexbox. But you have to be very organized with your code.

here is my code have no idea just testing things?[https://codepen.io/Mr-Fantastic-INC/pen/qBVbWXW

I may be mistaken so please don’t take my advice as correct, but I believe you should add the ‘display: flex;’ and ‘flex-direction’ property on your ‘#projects’ id in your CSS.

You currently have it attached to ‘img’ so it might be throwing it off.

My thought process it by adding the entire #projects id that it might align the images and text.

Again I’m still learning, but hopefully either this helps (or shows you exactly what NOT to do lol).

ok ill try it thank you

I got it basic for now. I had to do it on my child class div project tile instead.

please share you code then it will be easy to point out where is the problem codeprozone it is highly recommended for understanding how to put image and link

Good job, it definitely looks more organized now. Did you want to keep it in column form or do it as a row? Or was the flex-direction: row throwing it off?

im good for now. thank you for your help