3 column preview card component using CSS Flexbox

Community feedback

• 

  Abdul Khaliq 🚀•72,560

  @0xabdulkhaliqPosted over 1 year ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  • I have other recommendations regarding your doubts that I believe will be of great interest to you.

  ---

  CSS 🎨:

  • "I wanted to make the text on the button transparent so that it would show the card's background color. but I could not do that. Instead, I had to give color to each button manually", Yeah we can handle that issue with a css color function named rgba()

  ---

  • The rgba() function define colors using the Red-green-blue-alpha (RGBA) model. RGBA color values are an extension of RGB color values with an alpha channel, which helps us to take control over the opacity of the color.

  ---

  • So just add rgba(0,0,0,0) for the button elements during hover

  ---

  • Let's look an example

  button:hover {
  background-color: rgba(0,0,0,0);
  }
  

  ---

  • Now you have gotten the desired result without hassling in an efficient way.

  .

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  Happy coding!

  0