I learnt about box-sizing: border-box; which was life saver when it comes to defining size and padding
I needed some help to center the card to the middle of the page. Then took some help from claude.
good job, it looks pretty similar to the example picture. only your pictures seem broken.
you were a little too eager with your src referral. its enough to start with /assets/images, there is no need to start with /blog-preview-card-main. your index.html is on the same level as our assets/images folder.
be careful using "/" in folder/directory names, it is better to create a folder "assets" and in the "assets" folder a new folder named "images".
See the "reserved characters" in the link below for the characters which should not be used naming files and directories: https://learn.microsoft.com/en-us/windows/win32/fileio/naming-a-file
For the rest you are on the right track, well done.
I tried hard to let every items go to the right place. It's difficult for me since I'm really a beginner. I'd like to try different methods next time and make my coding structure more clearly.
What challenges did you encounter, and how did you overcome them?I'm confused with the position and I searched for the solution.
What specific areas of your project would you like help with?Position
You did a pretty good job.
i see you used both "display: flex" and "position: absolute" i would advise to only use "position" if it is absolutely necessary. In my opinion you could remove the (position, top, left and transform in .qrcode) and try playing with padding (and margin) around objects.
Starting with "display: flex" is good practice. https://css-tricks.com/snippets/css/a-guide-to-flexbox/
position can be helpfull when you want to move things more independently/fixed from the rest of the code and or make objects interactive. Maybe the following website helps you a little further in your understanding about position: https://css-tricks.com/almanac/properties/p/position/
