I am trying to style the html helper webgrid but it is not showing my style classes when the page renders.
Here is my style code:
.gridTable
{
margin: 5px;
padding: 10px;
border: 1px solid #000000;
border-collapse: collapse;
min-width: 550px;
background-color: #fff;
color: #fff;
}
.gridHead th{font-weight: bold;background-color: #030D8D;color: #fff;padding: 10px}
.gridHead a:link,.gridHead a:visited,.gridHead a:active,.gridHead a:hover {color: #fff;}
.gridHead a:hover {text-decoration:underline;}
.gridTable tr.gridAltRow
{
background-color: #FFFF99;
}
.gridTable tr:hover
{
background-color: #CCFFCC;
}
.gridAltRow td
{
padding: 10px;
margin: 5px;
color: #333;
}
.gridRow td{padding: 10px;color: #333;}
.gridFooter td{padding: 10px; background-color: #c7d1d6;color: #999;font-size: 12pt;text-align: center;}
.gridFooter a{font-weight: bold;color: #333; border: 1px #333 solid;}
Here is my webgrid code:
@grid.GetHtml(tableStyle:"gridTable",
headerStyle:"gridHead",
alternatingRowStyle:"gridAltRow",
rowStyle:"gridRow",
displayHeader:true,
columns:grid.Columns(
grid.Column(header:"", format: @<text>@item.GetSelectLink("Edit")</text>),
grid.Column(columnName: "EntityName", header: "Name"),
grid.Column(columnName: "EntityDBA", header: "DBA"),
grid.Column(columnName: "EntityType", header: "Type")),
mode: WebGridPagerModes.All)
Is there some reason I am missing why the style would not be applied?
Two reasons why your styles wouldn't be applied are: if they are not referenced correctly in the layout page or wherever you are bringing styles into your view; or you may need to clear your browser cache to allow updates to the css file to show through.