@erickcuenca
@salvagedscrap
Submitted
Hello everyone,
I ve used flexbox in order to align items around, which I find it very useful for little projects. I m wondering what sort of property one must use in order to acquiere such box shadow thats shown in the example.
Thanks!
@erickcuenca
Posted
Hey!
Fantastic job. To answer your question, to get that effect. Use the CSS property “filter: drop-shadow(…)”.
Here’s some content explaining the difference between “box-shadow” and “drop-shadow” https://css-tricks.com/breaking-css-box-shadow-vs-drop-shadow/
Marked as helpful
@littygabby
Submitted
I had a great time solving this but my only problem is the space between the ETH and 3 Days left, Also the tiny font.
Please help me solve it.. Thanks
@erickcuenca
Posted
This is some great work! I have some recommendations that will definitely improve your CSS and HTML on this project and for projects to come.
Dig into understanding semantic HTML...
<div class="eth"> <img class="ethlogo" src="./images/icon-ethereum.svg" alt=""> 0.041 ETH </div>Each HTML element has a purpose and semantic meaning. <div> elements are used to create "division" on your web page (they are great to use as containers). For the most part, it's best practice not to have text content directly inside of a div. In this case, "0.041 ETH" was directly in this div.
Dig into understanding how to use flexbox... (this will really help you with formatting and placement of elements on a web-page)
Here are some amazing FREE resources to learn...
This resource is gold when it comes to learning. This covers IMPORTANT core concepts of CSS. Do me a favor and do this course! https://web.dev/learn/css/
This is a great resource to practice flex-box (it's a game) https://flexboxfroggy.com/
Marked as helpful
