2nd challenge for me so far and this one went way better than my 1st. only took me maybe 4ish hours, and the last hour or so was me trying to figure out why I couldn't hover over the equilibrium image and make it transparent and cyan. I figured making it clickable might do it, or adding the color as a background color and changing the z-index on hover might work but to no avail. If anyone could point me in the right direction, that'd be great, Thanks all!!
Alessio Maddaluno
@AlessioMaddalunoAll comments
- @LordShoguSubmitted almost 3 years ago@AlessioMaddalunoPosted almost 3 years ago
In order to get that effect you have to use the "position" css property for creating the overlay over the div that contains the image. If you have a container with a css property position:relative, you can put your overlay inside it and make it cover all the container (using the position:absolute and adjust it). Then you can set the level opacitiy to 0 the make it disappear and play a bit with the hover propery to make it appear it again when your cursor is over the container itself.
Marked as helpful1 - @EugiSsSubmitted about 3 years ago
Hello. I recently started learning HTML and CSS. This is my first experience. I would be glad to advise on improvement and any criticism. Thanks :)
@AlessioMaddalunoPosted about 3 years agoNice job! The only thing I would "fix" is the border-radius of the component (giving that a less radius) and the the shadow color/opacity. Besides that, it's really cool!
Marked as helpful0 - @Tomi-pterSubmitted about 3 years ago
Feedback will be appreciated!! 😁
@AlessioMaddalunoPosted about 3 years agoNice job! Looks good! The only thing I can suggest you is take a look at the line-height CSS property. You can use it to add a little bit of space between the line of the card texts
Marked as helpful0