Static QR Code Page

Solution retrospective
Any advice on getting it centered in the middle of the page?
Please log in to post a comment
Log in with GitHubCommunity feedback
- @gabprojects
I'll give you a general tip to help you:
Create an account on this site:
https://chat.openai.com/
Then start asking your questions to the AI
An example question and answer:
Question:
How can I center html elements in the center of the page?
AI Response:
To center HTML elements on a webpage, you can use CSS to apply different techniques depending on the context and the type of element you want to center. Here are a few common methods to center elements both horizontally and vertically:
Using Flexbox: Flexbox is a CSS layout model that simplifies centering elements both horizontally and vertically.
HTML:
<div class="container"> <div class="centered-element">
</div> </div><!-- Your content here -->
CSS:
.container {
display: flex;
justify-content: center;
align-items: center;
height: 100vh; /* Adjust as needed */
}
- @Wismal
In your parent object, in this case the body, I recommend you to use the properties display:flex or display:grid. Both of them are indispensable for learning front-end. If you use flex, then you have to write "justify-content: center" (centers horizontally) and "align-items: center" (centers vertically). Later, the property "height: 100vh" to ensure that the body takes all the height.
ps: if you use grid, is the same, but you can use the property "place-content: center" instead of the justify and align
- @Olatoyan
Hello there, I checked your Github and I couldn't find any code there to assist you. Kindly provide more information.
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