top of page

How to Highlight Important Tables in Knack using CSS

Updated: Nov 10




Sign up to Knack for Free - Affiliate Link


In this video, I share my recent experience working with a client who needed to make an important Alert Notes table stand out. Although I'm not a coder, I managed to customise a table using ChatGPT and some basic CSS, and I want to show you how I did it!


We'll go through the steps of changing a table's appearance to make it more noticeable, including changing the colour, border thickness, and font size. I'll demonstrate how to tweak CSS settings in your application to achieve similar results.


Update Title


<p style="color:#cf2474;font-size:20px"><strong><span style="color:#ff0000">Clients Table</span></strong></p>

Add to CSS


/* Change table outline and grid color to red */

#view_4 > div.kn-table-wrapper > table {

border: 2px solid red; /* Outline color */

border-collapse: collapse; /* Ensures no space between borders */

}


#view_4 > div.kn-table-wrapper > table th,

#view_4 > div.kn-table-wrapper > table td {

border: 1px solid red; /* Grid color */

}




9 views0 comments

Recent Posts

See All

Comments

Rated 0 out of 5 stars.
No ratings yet

Add a rating
bottom of page