@Jos02378
Posted
Hey @pccipru, good job on this solution!
Some suggestions for you:
- You can use
text-transform: uppercasefor capitalizing text in CSS instead of explicitly typing them in HTML. - You can add an additional overlay with a lower opacity to achieve the same color for the image.
- You can try to follow a CSS naming convention called BEM. You can watch this video for more information Watch the video.
- You can try to use relative units like rem in the future. Here is a link to an article that explains when to use which unit read the article.
- Try to recreate this solution without setting an explicit height on your elements. You can try to use
min-heightor not setting the height at all so the card can grow as the content grows.
I hope this helps, good luck!
Marked as helpful
@pccipri
Posted
Hey @Jos02378, thanks for taking your time to look over my solution. I will try to recreate some of my solutions so I can improve them.Also I will look into the BEM since i want to make my code easier to maintain. One question tough, do you think i should've used classes instead of id's, i did so because i thought it's a one page thing so it wouldn't hurt but i would like to hear your opinion as well.Anyway thanks a lot for the advice
@Jos02378
Posted
Hey @pccipru, I think that it is fine for you to use id instead of class because this solution is simple and you use id in the correct way. However, I would suggest you use a class because it has lower specificity than id and it can be used for multiple elements. So if you need to overwrite a CSS class style, you can use an id. On the other hand, if you use an id, you will need an inline style to overwrite its style.
I hope this helps, good luck!
Marked as helpful
@pccipri
Posted
@Jos02378 Thanks again for the advice. I will edit the code as soon as I can.
