FCC : Product Landing Page (CakeBoss)

I need help with my CSS flexbox… I am stuck. Link to page above. Many thanks in advance for taking the time to respond.

Hi.

I tried to check your page, and I think where you keep the instruction for flex is important.
In this case try to write:

#header {
display: flex;
}

on your CSS.

Thanks… It worked. Can you think of any other thing I can do to make the design a lot better ? Any suggestions will be appreciated. Thank you so much.

Hey there. How’s your project going on now?

I can see that you need margin/padding on your website so that it will give a better look for users.
If you want my suggestion, perhaps you can tone down on the cake pictures and choose the best 3/4/5, but if you want all of the pictures, its good if you can give space between pictures or some styles on it.

And you can add some buttons too (for example: “order” buttons), to make it more interesting.

You can also use :hover or change the opacity of the images.

Good Luck!

1 Like

Very cool suggestions. Let me try them out…

@aquiADA1 I agree with @eermayasari, a padding or margin to the whole body would make your page look better.
Also, in your #Gallery element, I can see you tried to avoid horizontal overflow using flex-wrap: wrap which didn’t give a good result because the gallery is not wrapping, and the reason of this is because you set a fixed width (width: 900px). Change it for max-width: 900px, and you’ll have a better behaviour, inmediately :wink:

1 Like

I set the margin to 0px in the body is that okay ??. I have also followed the suggestions you gave and changed the width to max-width. what do you think ??

Hi,
You should definitely remove the position:fixed from #header. The animation keeps showing even when we scroll down your page, center align your gallery and do some margin and padding.
and don’t move the animation to -20px above, move it from 0px to 20px. Animation is going out of the screen because of negative value.
PS: Changing font would be good too. Nobody uses cursive writing for their websites, it just doesn’t look good professionally. Don’t necessarily have to do this, just my opinion.

Thank you so much. Will implement the suggestions.

I set the margin to 0px in the body is that okay ??. I have also followed the suggestions you gave and changed the width to max-width. what do you think ??

Thank you so much. Will implement the suggestions.