Streaming live at 10am (PST)

How to style CSS category colors to be different

Hi guys!

I am new to webflow and am creating a website for scratch. I am trying to create a blog section using collections and now I want to add a category div block. I linked the category to my CSS collection, but I want to change the color of the background for each one. For example, MLB would be blue, NBA would be purple, etc.

I want it to look something like this, but with different colors. Also, can someone see if I am inserting the div block correctly using absolute/relative? Thank you!!

Screen Shot 2020-11-06 at 2.02.34 PM|689x331


Here is my site Read-Only: https://preview.webflow.com/preview/cleatstreet-14d238d93153c3ed320bb3d4033?utm_medium=preview_link&utm_source=designer&utm_content=cleatstreet-14d238d93153c3ed320bb3d4033&preview=2c958336fb43a99b4a4b63fbbb100044&pageId=5f8b5687c42740baf62eb588&mode=preview

Hi @summerslough and welcome.
To color question you can watch this VIDEO

To div question, absolutely positioned element should be inside relative positioned element. I see that you have a lot of divs in your card. Your first div in collection Item is positioned absolutely that’s technically wrong. I will set the first div in collection Item as relative as eg. item__container and go from there. I will recommend to watch each video in Webflow University as is a great resource for basic information. :wink:

hi @summerslough does this answer solved your question?