I'd really appreciate any constructive feedback you can give — whether it's about code structure, naming, layout, responsiveness, or anything else. I'm open to suggestions on best practices, things I might have missed, or areas I could improve. I'm also eager to hear what direction I could grow in as a developer moving forward.
Latest solutions
blog-preview-card Vanilla CSS
#bemSubmitted about 1 hour agoI want to improve the adaptability of the font and improve details.
Qr component in vanilla
#bemSubmitted about 1 year agoAs for preprocessing css with sas, I want to learn sas.
Recipe page responsive
#accessibility#bemSubmitted over 1 year agoHow they would have made a cleaner HTML structure and what CSS properties they would have used to generate less code and better project quality. I want to improve image adaptability and cross-branch task management in Git for optimal workflow.
Latest comments
- P@Nick-RinskyWhat specific areas of your project would you like help with?@ronitzdev
You can prevent your card from warping to a specific size by using these techniques in CSS:
Set minimum values: Use min-width and min-height on the card so that it is never smaller than those values.
Set maximum values: Use max-width and max-height to limit the growth of the card.
Use box-sizing: border-box: So the padding and border are included in the total size of the card.
Avoid fixed width/height values: Prefer width: 100% and height: auto so that the card fits the container, but respects the minimum and maximum values.
Add media queries: Adjusts the borders at different screen sizes to maintain proportion and avoid warping.
- @lord-AceWhat are you most proud of, and what would you do differently next time?
I'm proud of the speed of completion and the rate at which my development skills have improved and I want to learn to style better
@ronitzdevHi, I see that you have added the font to the code, but you need to add the font family property to the body, also reduce a little the padding to the buttons; and to the sentence that follows the location add a suitable gray color without losing visual accessibility. In addition to leaving the buttons with a width of 100%. Topics such as the BEM convention can be useful. Practice with an interactive game like flexbox froggy to reinforce knowledge.
- @ChrissBenitezWhat are you most proud of, and what would you do differently next time?
Using git to publish on github pages, I had never used it.
What challenges did you encounter, and how did you overcome them?centering vertically the element, I used absolute position
What specific areas of your project would you like help with?Nothing so far so good.
@ronitzdevHi, I found your project very nice. As for the image container, you can use the figure tag with the same .qrcode--image class. You can also add the property left and rigth in the developer attribution with a value of zero to center it, a background color like white, and padding up and down. To make it stand out and look clearer. And in the text a font size in rem unit. Mostly because it is used professionally. Otherwise fine.
Marked as helpful - @Basomka@ronitzdev
Hello, to improve the visualization of your project on mobile, I recommend you to modify the height of the body tag with an automatic value, a padding of 10px and a padding of 1rem to the text container. I have invested on the BEM methodology for the html structure.