Eugene Clark• 50
@clarkjr2016
Posted
Hello @ramiroWeb.
Congratulations on completing the challenge.
Below I have a list of some notes that could make your project more accessible and responsive.
- The divs with the classes
.about-contentand.linkscould be replaced as<section>elements to make your HTML more semantic. - The value for your
altattribute on your<img>element with theclassof.photo-profilecould be more specific about what the image is, something as simple as "avatar photo profile". - Your
<main>container element isn't responding to different viewport widths. To be very transparent, I struggled with this myself but after reviewing previous comments on my past work I developed a workable solution:
- You can add
paddingaround the interior of the<body>element so that your.containerhas space between it's border and the border of the body element. - Then you can set
display: flex,flex-direction: column,justify-content: center, andalign-items: centeron the<body>element so that the.containerelement is positioned in the middle of the<body>element. - Finally I would apply
max-width: 100dvhto the<body>element so that as the viewport width decreases so would the<body>element's.
Marked as helpful
1
