A CSS Challenge from Fred:
Make lists look like basic MS-Office tables:
- dark background header row with white text
- alternate rows with light color background
- dark bottom borders on every rows
Here is the CSS to start your list/library styles!
/* ---------- Table Rows ----------*/
/* Set background for every row */
.ms-listviewtable > tbody > tr {
background: white;
}
/* Set border for every row */
.ms-listviewtable > tbody > tr td{
border-bottom: 1px solid #AFAFAF !important; /* !important needed over override SharePoint inline style */
}
/* Set background for every alternating row */
.ms-listviewtable > tbody > tr.ms-alternating {
background: #E2E3E5;
}
/* ---------- Table Header Row ----------*/
/* Remove background set in SharePoint's general data table style */
.ms-listviewtable tr.ms-viewheadertr {
background: transparent;
}
/* Modify background color */
tr.ms-viewheadertr > th.ms-vh-icon, /* Input box and attachment icon */
tr.ms-viewheadertr > th.ms-vh, /* Text */
tr.ms-viewheadertr > th.ms-vh2 /* Text */ {
background: #2E4C70;
}
/* Modify background color on hover */
tr.ms-viewheadertr > th.ms-vh:hover,
tr.ms-viewheadertr > th.ms-vh2:hover {
background-color: #273C51;
border-color: #273C51;
}
/* Modify font color */
.ms-viewheadertr a,
.ms-viewheadertr div {
color: white;
}
/* Modify font color on hover */
.ms-viewheadertr a:hover,
.ms-viewheadertr div:hover {
color: white;
}
/*
SharePoint Experts, Inc.
sharepointexperience.com
*/

CSS Challenge Response: Simple styles for SharePoint list – http://t.co/Cod4sjqO
This code does not seem to produce the colors indicated. Did I miss something:
/* ———- Table Rows ———-*/
/* Set background for every row */
.ms-listviewtable > tbody > tr {
background: white;
}
/* Set border for every row */
.ms-listviewtable > tbody > tr td{
border-bottom: 1px solid #AFAFAF !important; /* !important needed over override SharePoint inline style */
}
/* Set background for every alternating row */
.ms-listviewtable > tbody > tr.ms-alternating {
background: #E2E3E5;
}
/* ———- Table Header Row ———-*/
/* Remove background set in SharePoint’s general data table style */
.ms-listviewtable tr.ms-viewheadertr {
background: transparent;
}
/* Modify background color */
tr.ms-viewheadertr > th.ms-vh-icon, /* Input box and attachment icon */
tr.ms-viewheadertr > th.ms-vh, /* Text */
tr.ms-viewheadertr > th.ms-vh2 /* Text */ {
background: #2E4C70;
}
/* Modify background color on hover */
tr.ms-viewheadertr > th.ms-vh:hover,
tr.ms-viewheadertr > th.ms-vh2:hover {
background-color: #273C51;
border-color: #273C51;
}
/* Modify font color */
.ms-viewheadertr a,
.ms-viewheadertr div {
color: white;
}
/* Modify font color on hover */
.ms-viewheadertr a:hover,
.ms-viewheadertr div:hover {
color: white;
}
/*
SharePoint Experts, Inc.
sharepointexperience.com
*/
I am happy to help you debug it but I need to see your source code or something similar to start to understand what may be wrong. You can submit a screenshot or a text file using this form: http://blog.sharepointexperience.com/csschallenge/
Oh nevermind I see you sent in a message already! Thanks, I will reply.