More Style

.TableNews
{
    width:100%;
    padding:0px;
    margin:0px;
    /*background-image:url(../../Images/bg/body_bg.gif); 
    background-repeat:repeat-y; 
    border:1px solid black;  */
}
.tdCol1
{
    width:20%;
    vertical-align:top; 
}
.tdCol2
{
    width:40%;
    vertical-align:top; 
}
.tdCol3
{
    width:35%;
    vertical-align:top; 
}
.tdCol4
{
    width:5%;
    vertical-align:top; 
}

/*
.popupStyle
{
   background-image:url(../../images/bg/bg.png);
   border:2px solid black;
   font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;  
    font-size:12px;
}

*/

.BulletedListStyle
{
    font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;  
    font-size:12px;
}
.popupHeaderStyle
{
    background-color:#FF3399;
    text-align:right;  
    vertical-align:top;
    vertical-align:text-top;   
}


.popupStyle
{
   background-image:url(../../images/bg/bg.png);
   border:1px solid #C6B58A;
   font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;  
    font-size:12px;
}

.popupHeaderStyle
{
    background-color:InactiveCaptionText;
    border-bottom:1px solid #C6B58A;
    color:White;  
    font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;  
    text-align:right;  
    vertical-align:top;
    vertical-align:text-top;   
}

.ButtonHide
{
    visibility:hidden; 
}

.tableMain
{
    border:solid 1px #C6B58A;
    padding:0px;
    margin:0px;  
    height:auto; 
    text-align:left;     
        
}
.trBanner
{       
    border:solid 1px #C6B58A;
}
.tdBanner
{
    background-image:url(../Images/banner.jpg);
    background-repeat:repeat; 
    background-color:Gray;
}
.tdMenu
{
    /*background-image: url(../../images/bg/menu.gif); */
    background-color:#E9E9E9;
    height:25px;
    border:solid 1px #C6B58A;
      
}

.tableContent
{       
    width:100%;
    border:solid 1px #C6B58A;
    padding:0px;
    margin:0px;  
    height:420px;
    font-size:13px;
}
.tdContentLeft
{
    width:400px;
    padding:0px;
    height:auto;
    vertical-align:top;
}
.tdContentRight
{   
    width:400px;
    height:auto;
    vertical-align:top;
}
.tdContent
{
    width:100%;
    vertical-align:top; 
    padding:0px;
    margin:0px; 
}

.tableGrid
{
    width:100%;
    margin:0px;
    padding:0px;
    vertical-align:top;   
    border:solid 1px black;
}
.tdGridHeading
{
    border:solid 1px black;
    font-size:x-large;
    font-weight:bold;   
    color:#990000; 
    background-image: url(../../images/bg/gridheading.gif);
}
.tdGridControls
{
    border:solid 1px black;
    background-color:Olive; 
}
.DivContent
{
    float:left;
    vertical-align:text-top;
    border:solid 1px green;
    width:100%;    
}
.Button
{
    font-family:Verdana; 
    font-size:12px; 
    border:solid 1px black;
    width:50px;
    height:18px;
}
.LinkButtonStyle
{
    font-family:Verdana;
    color:White; 
}

.tableDetailsView
{
    width:100%;
    margin:0px;
    padding:0px;
    vertical-align:top;   
    border:solid 1px black;
}
.tdDetailsView
{
    text-align:center; 
}


/*-----------------FormView---------------------------------*/
.tableForm
{
    width:100%;
}

.tdHeader
{
    text-align:center;
    font-size:large;
    font-weight:bold;
    background-image: url(../../images/bg/gridheading.gif);      
}
.tdFormContent
{
   
    font-size:11px;
    font-weight:normal;
}

Grid Style

.mGrid { width: 100%; background-color: #fff; margin: 5px 0 10px 0; border: solid 1px #525252; border-collapse:collapse; }
    .mGrid td { padding: 2px; border: solid 1px #c1c1c1; color: #717171; }
    .mGrid th { padding: 4px 2px; color: #fff; background: #424242 url('../../Images/Grid/grd_head.png') repeat-x top; border-left: solid 1px #525252; font-size: 0.9em; }
.mGrid .alt { background: #fcfcfc url('../../Images/Grid/grd_alt.png') repeat-x top; }
.mGrid .sel { background: #fcfcfc url('../../Images/Grid/grd_sel.png') repeat-x top; }
.mGrid .pgr {background: #424242 url('../../Images/Grid/grd_pgr.png') repeat-x top; }
    .mGrid .pgr table { margin: 5px 0; }
    .mGrid .pgr td { border-width: 0; padding: 0 6px; border-left: solid 1px #666; font-weight: bold; color: #fff; line-height: 12px; }  
    .mGrid .pgr a { color: #666; text-decoration: none; }
    .mGrid .pgr a:hover { color: #000; text-decoration: none; }
   
   
   
   
   .GridStyle
{
    border: 0px double #336666;
    font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;  
    font-size:11px;
    background-color:transparent;
   
}
.GridStyle table th {text-align:left; border:none; }
.GridStyle table td {text-align:left; background-color:Yellow;}
.GridStyle th a { float: left; text-decoration:none;}

.GridRow
{
    text-align:left;
    height:10px; 
    background-color:transparent; 
}
.GridHeader
{   
    background-color:#A28156;
    font-weight:bold;
    height:20px;    
    text-decoration:none;
    text-align:left;
    color:Black;  
}
.GridRowSel
{
    text-align:left;
    height:10px; 
    background-color:GrayText; 
   
}
.GridFooter
{
    background-color:#79BAEC;
   
}
.GridPager
{
    background-color:#A28156;
   
}
.GridPager table td
{
    background-color:#A28156;
}
.GridPager a
{
    background-color:transparent;
}
.GridPager a:hover
{
    text-decoration: underline;
}
/*-----------Details View Style--------------------*/
.DViewStyle
{
    border: 1px solid #336666;
    font-size:12px;
    text-align:left; 
}

.DViewRowStyle
{
    background-color:transparent;
}
.DViewAltRowStyle
{
    background-color:transparent;
}
.DViewEditRowStyle
{
    background-color:transparent;
}
.DViewFieldHeaderStyle
{
    background-color:transparent;
    width:100px;   
}
.DViewHeaderStyle
{
    background-color:#79BAEC;
    font-weight:bold; 
    color:White;
    background-image: url(../../images/bg/gridheading.gif);   
}
.DViewFooterStyle
{
    background-color:#507CD1;
    font-weight:bold; 
    color:White;
   
   
}
.DViewCmdRowStyle
{
    background-color:#A28156;
    font-weight:bold; 
   
}
.DViewTextBox
{
    width:99%;
    font-family:Verdana; 
    font-size:12px;
    border:solid 1px blue;
    height:18px; 
   
}
.DViewEditRowStyle td input[type=text]
{
    font-family: Verdana,Sans-Serif,Arial;
    font-size:12px;
    border: 1px solid #336666;
    width:98%;
   
}
.DViewEditRowStyle td input[type="checkbox"]
{
    border: 1px solid #336666;
   
}
.DViewEditRowStyle td input[type="radio"]
{
    font-family: Verdana,Sans-Serif,Arial;
    font-size:12px;
   
}

Basic Style

/* #FE9A2E #FF8000 style="background-image:url(~/Images/Icons/1.jpg);background-color:Green; " */

body
{
    /*background-color:#FE9A2E; */
    background-image:url(../../images/bg/bg.png);   
    font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;  
    font-size:11px;
    margin:0px;
    padding:0px;


   
}
img {     padding-right: 0px; }

/*-------------Menu Style-------------  */

.MenuStyle
{
    background-image: url(../../images/bg/menuitem.gif);
    padding:4px;
    color:White;
    text-align:left; 
}
.MenuStyle a
{
    padding-right:8px;     
}

.MenuStyleSide
{   
    padding:4px;
    color:White;
    border:solid 1px #C6B58A;
}

.MenuItemStyle
{
    background-image: url(../../images/bg/menuitem.gif);
    padding:5px;
    border:solid 1px #C6B58A;
    border-top:none;
    color:White; 
    z-index: -1;
    width:40px;
   
     
}
.StaticMenuItemStyle
{   
    padding:2px 2px 2px 2px; 
}
.MenuItemHover
{
    background-image: url(../../images/bg/mouseovermenuitem.gif);
    padding:5px;
    border:solid 1px #C6B58A;
    border-top:none;
    color:White; 
    z-index: -1;
    width:40px;
    background-color:Red;
}
.MenuHover
{   
    padding:2px 2px 2px 2px;
    color:White;
    text-align:left;
    background-color:RED;
}

.HomeMenuItemStyle
{
    margin-right:2px;
}
.HomeMenuStyle
{
    /*background-image:url(../../images/bg/menu_home.jpg);*/
    text-align:center; 
}


/*-----------GridView Style--------------------*/

.GridStyle
{
    border: 3px double #336666;
    font-size:12px;
    background-color:White;
   
}
.GridStyle table th {text-align:left; background-color:Yellow; }
.GridStyle table td {text-align:left; background-color:Yellow;}
.GridStyle th a { float: left; }

.GridRow
{
    text-align:left;
    height:10px; 
    background-color:White; 
}
.GridHeader
{   
    background-color:#79BAEC;
    font-weight:bold;
    height:20px;    
    text-decoration:none;
    text-align:left;
    background-image: url(../../images/bg/gridheading.gif); 
}
.GridRowSel
{
    text-align:left;
    height:10px; 
    background-color:#95B9C7; 
    font-weight:bold;   
}
.GridFooter
{
    background-color:#79BAEC;
   
}
.GridPager
{
    background-color:#79BAEC;
    background-image: url(../../images/bg/gridheading.gif);
}
.GridPager table td
{
    background-color:#79BAEC;
}
.GridPager a
{
    background-color:#79BAEC;
}
.GridPager a:hover
{
    text-decoration: underline;
}
/*-----------Details View Style--------------------*/
.DViewStyle
{
    border: 3px double #336666;
    font-size:12px;
    text-align:left; 
}

.DViewRowStyle
{
    background-color:White;
}
.DViewAltRowStyle
{
    background-color:White;
}
.DViewEditRowStyle
{
    background-color:White;
}
.DViewFieldHeaderStyle
{
    background-color:#E1FDFD;
    width:100px;   
}
.DViewHeaderStyle
{
    background-color:#79BAEC;
    font-weight:bold; 
    color:White;
    background-image: url(../../images/bg/gridheading.gif);   
}
.DViewFooterStyle
{
    background-color:#507CD1;
    font-weight:bold; 
    color:White;
   
   
}
.DViewCmdRowStyle
{
    background-color:#79BAEC;
    font-weight:bold; 
    background-image: url(../../images/bg/gridheading.gif);   
}
.DViewTextBox
{
    width:99%;
    font-family:Verdana; 
    font-size:12px;
    border:solid 1px blue;
    height:18px; 
   
}
.DViewEditRowStyle td input[type=text]
{
    font-family: Verdana,Sans-Serif,Arial;
    font-size:12px;
    border: 1px solid #336666;
    width:98%;
   
}
.DViewEditRowStyle td input[type="checkbox"]
{
    border: 1px solid #336666;
   
}
.DViewEditRowStyle td input[type="radio"]
{
    font-family: Verdana,Sans-Serif,Arial;
    font-size:12px;
   
}
/*
# input[type=text],
# input[type=button],
# input[type=submit],
# input[type=reset],
# input[type=password],
# input[type=file]
*/  

/*-----------Login Style--------------------*/

.LoginStyle
{
    background-color: #FFF8C6;
    border-color:#DF7401;
    border-style:solid;
    border-width:1px;
    font-size:12px;
    color:#333333;

}
.LoginTextBox
{
    Font-Size:12px;
    font-family:Verdana;  
    border-color:#DF7401;
}

.LoginButton
{
    background-color: White;
    border-color:#DF7401;
    border-style:solid;
    border-width:1px;
    font-size:12px;
    color:#284E98;
}
.LoginInstruction
{
    font-style:italic;
    color:Black;   
}
.LoginTitle
{
    background-color: #FE9A2E;
    font-weight:bold;
    font-size:12px;
    color:White;  
    background-image: url(../../images/bg/menu.gif);
}


/*-------------------Grid Style for Contents--------------------*/

.GridStyleWeb
{       
    margin:3px 8px 3px 0px;
}
.GridStyleWeb table th {text-align:left;  }
.GridStyleWeb table td {text-align:left; }
.GridStyleWeb th a { float: left; }
.GridStyleWeb table td a {text-align:left; }

.GridRowWeb
{
    text-align:left;
    height:30px; 
    padding-left:3px;
}
.GridRowWeb td
{
    border:none;
}

.GridHeaderWeb
{   
    font-weight:bold;
    height:20px;    
    text-decoration:none;
    text-align:left;
    color:Black;  
}
.GridHeaderWeb th
{
    text-align:left;   
    border:none;
}

.GridRowSelWeb
{
    text-align:left;
    height:10px; 
    font-weight:bold;   
}
.GridFooterWeb
{
   
}
.GridFooterWeb th
{
   
}
.GridPagerWeb
{
}
.GridPagerWeb td
{
    border:none;
}
.GridPagerWeb table td
{
   
}
.GridPagerWeb a
{
}
.GridPagerWeb a:hover
{
    text-decoration: underline;
}


/*------------------- Style for Page Contents--------------------*/

.tablePageContent
{
    width:100%;
    background-color:#E7D8B9;
    border:solid 1px #C6B58A;
    height:450px;
}

.tdPageHeading
{
    padding:12px 12px 0px 12px;
    height:50px;
    vertical-align:top;  
   
}

.PageHeading
{
    font-size:15px;
    color:Red;
}

.tdPageContent
{
    padding:0px 12px 12px 12px;
    line-height:1.5em;
    vertical-align:top;
    text-align:left;   
}

Grid Sorting

using System;


using System.Collections.Generic;

using System.Text;

using SunTrust.DemandDelivery.Entity;

using System.Web.UI.WebControls;

namespace SunTrust.DemandDelivery.Entity

{

public class EmployeeComparer : IComparer

{



string memberName = string.Empty;

SortDirection sortOrder = SortDirection.Ascending;



public EmployeeComparer(string strMemberName, SortDirection sortingOrder)

{

memberName = strMemberName;

sortOrder = sortingOrder;

}



#region IComparer Members



public int Compare(Employee dItem1, Employee dItem2)

{

int returnValue = 1;

switch (memberName)

{

case "EmployeeNo":

if (sortOrder == SortDirection.Ascending)

{

returnValue = dItem1.EmployeeNo.CompareTo(dItem2.EmployeeNo);

}

else

{

returnValue = dItem2.EmployeeNo.CompareTo(dItem1.EmployeeNo);

}

break;

case "OrgDateofRequest":

if (sortOrder == SortDirection.Ascending)

{

returnValue = dItem1.OrgDateofRequest.CompareTo(dItem2.OrgDateofRequest);

}

else

{

returnValue = dItem2.OrgDateofRequest.CompareTo(dItem1.OrgDateofRequest);

}

break;

default:

if (sortOrder == SortDirection.Ascending)

{

returnValue = dItem1.ID.CompareTo(dItem2.ID);

}

else

{

returnValue = dItem2.ID.CompareTo(dItem1.ID);

}

break;

}

return returnValue;

}



#endregion





}

}

protected void GridView1_Sorting(object sender, GridViewSortEventArgs e)


{

EmployeeBAO activeEmployeeBAO = new EmployeeBAO();

List list = activeEmployeeBAO.GetAllRecord();



//get the current column details

string strColumnName = e.SortExpression;

SortDirection strSortOrder = getSortOrder();

list.Sort(new EmployeeComparer(strColumnName, strSortOrder));

GridView1.DataSource = null;

GridView1.DataSource = list;

//customizeDataGridView();

//GridView1.Columns[e.ColumnIndex].HeaderCell.SortGlyphDirection = strSortOrder;







//list.Sort(new GenericComparer(e.SortExpression, e.SortDirection));

//GridView1.DataSource = list;

GridView1.DataBind();

}



private SortDirection getSortOrder()

{

if (CurrentSortDirection == SortDirection.Ascending)

CurrentSortDirection = SortDirection.Descending;

else

CurrentSortDirection = SortDirection.Ascending;



return CurrentSortDirection;

}



private SortDirection CurrentSortDirection

{

get

{

if (ViewState["SortDirection"] == null)

ViewState["SortDirection"] = SortDirection.Ascending;

return (SortDirection)ViewState["SortDirection"]; }

set

{

ViewState["SortDirection"] = value;

}

}

Grid Sorting

http://stackoverflow.com/questions/1377568/c-sharp-datagridview-sorting-with-generic-list-as-underlying-source