CSS for List View

I am struggling to figure out some of the CSS selectors for the list view. For example, I have a list of press releases. My list view includes a title and a body. How do I edit the CSS for the title field in each of the list items? Because when I copy the selector out of chrome, it just gives me the selector for that particular item such as:

#\35 6cdd900ecbbc8d93632f48d > div > div.kn-details-column.first > div > div > table > tbody > tr.field_1

Any guidance on this?

The best suggestion I have is to use the chrome inspector. Click on the element you want adjust and then click on the three dots to the left side of the highlighted line of code. A menu will pop-up. Mouse over "Copy" and then select "Copy selector." Paste this directly into Custom CSS pane and add style changes you wish to make. This has worked like a charm for me. Good luck!

Try something like this:

.kn-list .kn-details-column.first > tr.field_1

The chrome inspector windows gives clues at the bottom of the Elements pane, and often inside the Styles pane I find. I'm still doing some trial and error with these at times.

1 Like