modern css
What challenges did you encounter, and how did you overcome them?container queries
What specific areas of your project would you like help with?nothing
very much cool! would be great to see the source code and not only the build output =)
I am really happy that I am now paying close attention to design details! I believe I was able to get my solution very close to the original design. I experimented with both mobile-first and desktop-first approaches and still achieved the desired result! So I am glad that I am finally understanding responsiveness, but I also know that I still have a lot to explore and enhance my skills. 💪🏽
What challenges did you encounter, and how did you overcome them?None
What specific areas of your project would you like help with?Any feedback on how I can improve is welcome.🤗
very close to the design file 👍
you can use picture and source elements to not to load 2 images for mobile and desktop, but only one relevant image. take a look: web.dev link
.
What challenges did you encounter, and how did you overcome them?Never used table before and the styling isn't the best still.
What specific areas of your project would you like help with?Any feedback is appreciated.
congrats on completing the challenge!
let me suggest you some tools to align elements with design image:
it was pretty straight forward
What challenges did you encounter, and how did you overcome them?mostly the space bc i dont want to do that with margins so i did it with gap it is easier to change later
What specific areas of your project would you like help with?.
Nice design!
I really like your css variables! 👍
If to use links as anchors <a>, I think you'll get free keyboard navigation, also I saw a recommendation, to use <ul> and <li> for such list of items.
this my first project of frontend mentor. I'm so happy for making the solution.
What challenges did you encounter, and how did you overcome them?there was no challenge in this project.
What specific areas of your project would you like help with?the text area.
Nice photo you have there! =)
I don't know, but hope it'll be useful: on a challenge page there is a link to an archive with assets and some helpful md files, like style-guide, with exact colors from the design
I am proud to have built this project after learning how to properly use CSS units. This is my best work so far and I can't improve on it yet.
What challenges did you encounter, and how did you overcome them?I did not know how to apply proper margins and paddings, I could not center the card as well. I searched YouTube for helpful tutorials until I stumbled upon Kevin Powell's channel.
What specific areas of your project would you like help with?I do not need help as I have figured it out with the help of online resources. This is a simple project as well.
nice work!
solution screenshot has extra strings, but live solution as by design.
if to look closely there is a shadow under the card, to add shadow box-shadow css property is used (syntax: box-shadow: <x> <y> <blur> <spread> <color>), like:
.my-card {
box-shadow: 0 25px 25px 0 rgba(0, 0, 0, 4.77%);
}