Boxes or shading on tables/sections

You don’t need to be a developer to use CSS!  Don’t be afraid!  John did a developer talk this morning on the basics of using CSS to style skuid pages.  We’ll get it up on the skuid Youtube page in the next day or two.  You should check it out. 

I’ll keep an eye out for it. This stuff is really important to some folks. Thanks.

Here is the video.

    

Hope it helps you out… 

Yes, that was greatly helpful! I have TWO followups related to syntax on the css. I used the following to set colors in the field editor column - worked great: .nx-basicfieldeditor-column .nx-basicfieldeditor-section-wrapper .nx-basicfieldeditor-section-header { color: black; } .nx-basicfieldeditor-column .nx-basicfieldeditor-section-wrapper .nx-basicfieldeditor-section {background-color: #F0E68C; } .nx-basicfieldeditor-column .nx-basicfieldeditor-section-wrapper .nx-basicfieldeditor-item {background-color: #FFFFE0; } Question #1) When I want to specify a colorset for the first section, I follow “nx-basicfieldeditor-column”, etc by the suffix “:first-child”. What suffix do I use for sections 2 or 3? I tried :not(:first-child) and also :second-child. Question #2) I’ve been trying to do something similar for my column of TABLE components (related lists). I want to set font & background color for the column header row and for the detail rows. I’ve tried several combinations of field names/formats on this, but can’t get it right. .nx-pagebuilder-table .nx-pagebuilder-wrapper .nx-pagebuilder-table-header: { color: black; } .nx-pagebuilder-table .nx-pagebuilder-wrapper .nx-pagebuilder-table {background-color: #F0E68C; } .nx-pagebuilder-table .nx-pagebuilder-wrapper .nx-pagebuilder-item {background-color: #FFFFE0; } Any insight would be very much appreciated. Thanks bunches!

may be this will useful i am not sure…

 .nx-basicfieldeditor-section{background:none;}
 .nx-basicfieldeditor-item{background:none;}
 .nx-basicfieldeditor-column:nth-child(odd){background:#FFD79C;}
 .nx-basicfieldeditor-column:nth-child(even){background:#ADFDAC;}