Using Bootstrap, I have implemented custom CSS for pagination in a gridview. My master page includes:
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
In the aspx page, my gridview code looks like this:
<asp:GridView ID="grid_view_search" runat="server" onprerender="GridView_PreRender" DataSourceID="sql_data_source_search" AutoGenerateColumns="False" DataKeyNames="ID" CssClass="table table-hover table-condensed table-bordered" AllowSorting="True" AllowPaging="True">
<Columns>
//Columns here
</Columns>
<PagerSettings Mode="NumericFirstLast" />
<PagerStyle CssClass="pagination-bootstrap" HorizontalAlign="Center" />
</asp:GridView>
Everything is styled correctly except for "pagination-bootstrap", which appears as the default style in the browser (i.e. 12). However, in design view, it displays as intended (i.e. [1][2]).
I've tried adding the style directly to the gridview opening tag line but it hasn't made a difference. Most online solutions mention using "~/css" for file paths, but that doesn't seem to be the issue as other styles from style.css are working fine.
Any assistance would be greatly appreciated.
[Edit] Images of design view and browser view have been added below:
Design View:
Browser: