solutions

Backend & Cloud

In hac habitasse platea dictumst. Fusce venenatis condimentum fringilla. Mauris at mauris leo. Nulla rhoncus.

solutions

Digital Workplace

In hac habitasse platea dictumst. Fusce venenatis condimentum fringilla. Mauris at mauris leo. Nulla rhoncus.

services

Design

In hac habitasse platea dictumst. Fusce venenatis condimentum fringilla. Mauris at mauris leo. Nulla rhoncus.

services

Deliver

In hac habitasse platea dictumst. Fusce venenatis condimentum fringilla. Mauris at mauris leo. Nulla rhoncus.

services

Manage

In hac habitasse platea dictumst. Fusce venenatis condimentum fringilla. Mauris at mauris leo. Nulla rhoncus.

The Challenge

Is it possible to create columns that change color when you hover over them?

The Recipe

Some basic css can accomplish almost everything you need. Ideally, you would use flexbox to move the category above the header instead of physically placing it there to improve accessibility, but that is coming soon.

  1. Create a column
  2. Add hover-column to the css class field
  3. Add you content
    1. Category – text element with category class assigned
    2. Title (I used h3, but you need to use the appropriate heading level)
    3. Text
    4. Icon aligned right
  4. In the page level custom CSS add the following (you will need to edit slightly if you choose a different heading level)
Copy to Clipboard