I had a little difficult to center the element vertically so I'm not sure if the strategy I used is the best one. I'd like to know please if this is ok or there is a better way to do it?
Aayush Jaiswal
@aay7ushAll comments
- @laryssacarvalhoSubmitted over 1 year ago@aay7ushPosted over 1 year ago
Congratulations 👏 Laryssa Carvalho on completing your first challenge! You have shown great efforts in developing your code.
I have some suggestions on your HTML code. Firstly, I would recommend using the
<main>
element to wrap all the main content of your webpage. Additionally, try using semantic HTML elements like<article>
and<section>
instead of generic element like<div>
to improve the structure and meaning of your code.I noticed that you have an image of a scanned QR code. It is important to include an alt attribute on the
<img>
element that describes the purpose of the image for accessibility reasons.Moving on to your CSS, I suggest using BEM naming conventions for your classes. This naming convention helps to keep your CSS organized and readable, making it easier to maintain and update your code.
When applying font families, it is a good practice to use fallback fonts after the main font to ensure that your text will still be readable even if the main font is not available. To center all the content of a
<main>
element, you can use thedisplay: grid
andplace-content: center
properties on body element. You can also directly apply thetext-align: center
property to the body element instead of individually applying it to every element.If you are trying to center an element horizontally, you can use the margin-inline shorthand property instead of
margin: 0 auto
. Additionally, I recommend using relative units like rem or em instead of absolute units like pixels, as they are more scalable and responsive to the user's browser settings.Keep up the good work and happy coding!
Marked as helpful1