I have a question about best practices. I know it's usually recommended to use a CSS class selector .myclass instead of an id selector #myelement or an element selector div.
However, I was wondering, is it better to create a class even if we won't reuse it? For example:
As you mentioned, it's generally better to use classes instead of IDs because they are reusable.
And for your question, I wouldn't recommend using the first approach:
p { color: blue; }
This would apply to all the paragraphs on the page, which might not be what you want.
The second approach:
section p { color: blue; }
is better and can work fine for smaller projects. However, in larger projects, it can be harder to manage and understand which p you are styling since a section could contain more than one p
That's why it's always better to use a class, even if you are not going to reuse it.
Giving a class is a cleaner and more efficient way to apply styles, especially when dealing with bigger and more complex layouts where you want to be specific about which element that you're targeting.
I checked your code the reason the styles are not working correctly is that you didnt link the path correctly it should be this instead, after the edit it should work properly
I decided to make the QR code image a background image however I noticed that it shows up in every browser except Safari. Is there a reason for this or a work around? And how often does this happen in other projects?
I also think that the original design has some shadowing on the card component and I made an attempt to add this design effect but I'm just not there yet. Any resources to help with adding shadows / effects to images would be much appreciated. Also I welcome any other feedback so that I can continue to improve my HTML and CSS. Thanks!
Using IDs to select elements is one way to do it. However, it's generally preferred to use classes for the styling purposes. Classes offer reusability so you can apply the same class to multiple items to achieve the same styling. While an Id is often used to select a singular item and not to be reused so it kinda limits the styling process. So in terms of styling I'd say use classes.