Design comparison
Solution retrospective
Any advice on getting it centered in the middle of the page?
Community feedback
- @gabprojectsPosted over 1 year ago
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 */
}
0 - @WismalPosted over 1 year ago
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
0 - @OlatoyanPosted over 1 year ago
Hello there, I checked your Github and I couldn't find any code there to assist you. Kindly provide more information.
0
Please log in to post a comment
Log in with GitHubJoin 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