Question

In my grid view i have set bottom border for all cell because of which even pager row gets this border.
I want to remove this border. I tried using jquery but probably my selector is wrong.
I tried alert to check if jquery can find my grid view

alert($("#<%=gvClaimDetails.ClientID%> tr").length);

And all the time i get “0” as alert, even thought there is data in grid view.

I need to remove bottom border of pager row.

css for grid:

table.grid, .grid
{
table-layout: fixed;
border-collapse: collapse;
margin: 5px 0;    
width: 100%;
}


table.grid th, .grid th, .grid th a
{
padding: 5px;
font-size: 18px;
color: #009900; /* background: #ddd;  added */
border-bottom: solid 2px #dddddd;
text-align: left;
background: #FFFFFF;
}

table.grid td, .grid td
{
padding: 7px;
border-bottom: solid 1px #dddddd;
color: #555555;
font-size: 14px; 
 }

 table.grid tr.alternate td, .grid tr.alternate td
 {
padding: 7px;
border-bottom: solid 1px #dddddd;
 }

table.grid tr.selected td, .grid tr.selected td
{
padding: 5px;
border: 1px solid #bbb;
background: #fff;
color: Red;
 }


.pager a
 {
border: 0px solid red;
color: #0067A5;
text-decoration: none;
padding: 2px 5px;
 }

.pager span
 {
border: 0px solid #DBEAFF;
color: #FFFFFF;
padding: 2px 5px;
}


.pager a:hover
{
color: #1E90FF;
}

I am giving text-decoration:none still I can see underline below page numbers. Also border is zero px still there is border visible

Answer 1

This should work…

.pager,.pages td {border-bottom:0;}

I believe the CssClass applied as a PagerStyle is added to the row (tr), so this would 0 out the row and each cells border bottom.

Note: you may need to add an !important in there because you are defining a border bottom in other areas of your CSS that would be applied to the pager area as well.