Submitted 2 months ago

Coded using VS code and HTML, CSS are the technologies used.

venkatareddypalle-SD• 10

@venkatareddypalle-SD

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

QR code component

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

I am aspiring to become a front-end developer. Even though I haven't achieved much yet, I have taken a step forward in this journey, and I believe that's something to be proud of.

What challenges did you encounter, and how did you overcome them?

For now, I request community support to help me overcome the following issues:

I'd like to learn why I can't center a div vertically using Flexbox.
Why aren't my CSS and images being published?

What specific areas of your project would you like help with?

I request community support to help me overcome the following issues:

I'd like to learn why I can't center a div vertically using Flexbox.
Why aren't my CSS and images being published?

Community feedback

HeewonSeo1• 80

@HeewonSeo1

Posted 2 months ago

Hey! I hope this feedback is helpful.

As for your css not loading, it seems like when you hosted the site, your css file wasn't linked properly or you forgot to include it. Maybe check the files you uploaded when you were hosting? The css seems to load fine on my side.
If you want to vertically and horizontally align the card to the center of your page you could make the body tag a flex or grid element and use place-content: center, or justify-content/align-items.

This is a pretty good flexbox video: https://www.youtube.com/watch?v=phWxA89Dy94

AnasIsmai1• 240

@AnasIsmai1

Posted 2 months ago

At the moment, the reason why you cant center your div vertically is because the body is taking only that space which the div within is taking. If you give the body of a height 100vh, which is just the entire viewport height, it will center vertically normally. As for why your css and image isnt loading, i can't say did you try retaking a screenshot of the website.

Please log in to post a comment

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord