Miguel N Saleme
@MiguelN794All comments
- @0x0xoscarSubmitted 17 days ago
- @AndreNegrelliSubmitted 3 days ago@MiguelN794Posted 3 days ago
Hi friend, you would have to do the css or I don't know if you are going to do it in react.
good luck, and keep it up
0 - @emkumaSubmitted 3 days agoWhat are you most proud of, and what would you do differently next time?
At least I attempted to make it responsive.
What challenges did you encounter, and how did you overcome them?Brain fog, helplessness, frustration, anger, setbacks.
Exercise, meditation, coffee.
What specific areas of your project would you like help with?Appreciate getting newbie appropriate feedback.
Try to be respectful.
Thank you.
Eric Kumasaka
@MiguelN794Posted 3 days agoHi friend. Don't worry, it's normal, sometimes you have to stretch and do something else when you can't do anything.
To center the card, I added to the body:
display: flex; justify-content: center; align-items: center;
If you are not using AI extensions, I would recommend you try Codeium for Visual Studio Code, so you can check so that it does not generate all that stuff that is bad for you.
Good luck and this is the way.
0 - @emanmohamedsrSubmitted 15 days agoWhat are you most proud of, and what would you do differently next time?
Responsive QR-code page.
- What have I used?
- HTML - CSS
@MiguelN794Posted 10 days agoSure, here is the feedback:
-
Semantic HTML:
- The HTML structure is mostly semantic. The use of
<main>
,<div>
,<h1>
,<p>
, and<footer>
tags is appropriate. However, consider using a<section>
tag instead of a<div>
for the container to enhance semantic meaning.
- The HTML structure is mostly semantic. The use of
-
Accessibility:
- The
alt
attribute for the image is well-used, providing a description for screen readers. - To improve accessibility, consider adding
aria-label
attributes where necessary, such as on the links in the footer to describe their purpose. - Ensure that the color contrast between text and background is sufficient for readability.
- The
-
Responsive Layout:
- The current HTML does not include any responsive design elements. Ensure that the CSS includes media queries to handle different screen sizes.
- Use relative units (like percentages or viewport units) instead of fixed units (like pixels) for widths and heights to make the layout more flexible.
-
Code Structure, Readability, and Reusability:
- The code is well-structured and readable. The indentation and spacing are consistent.
- Consider using classes or IDs to target specific elements for styling or JavaScript functionality, which can improve reusability.
-
Design Consistency:
- Without the design reference, it's hard to determine if the solution differs considerably from the design. Ensure that the CSS matches the design specifications provided by Frontend Mentor.
0