Pagination

here you go: https://jolly-hawking7722.on.getshifter.io/

thank you! it worked after removing width: 100%; from .dataTables_paginate
i have some more questions, sorry lol. is there anyway i can move the text ‘previous’ and ‘next’ and place it between the buttons? and then change the same text to something like ‘page 1 of 10’?

this illustration should help visualize it: https://imgur.com/pG6eVhD thats how im trying to make it look but im having trouble with spacing, the buttons just overlap the text. also, the table info checkbox misaligns the centered pagination.

ok 🙁 i was able to remove the text ‘previous’ and ‘next’ by using your extension changing data strings via json and all thats left now is the arrows. but the arrows arent centered properly, it seems like theres something thats pushing the arrows to the left/right: https://imgur.com/Uarra0o also whenever i try to change the size using font-size: 20px; the arrows are pushed to the bottom and vertical-align: middle !important doesnt work: https://imgur.com/45FJRRN

im not sure how to remove the text from the website but it happens on there too and i provided images from localhost

also, heres the code

.dataTables_paginate a {
	font-family: Montserrat;
	font-size: 12px;
	text-decoration: none !important;
}

.dataTables_paginate {
	float: none;
	text-align: center;
	padding: 30px !important;
}

.paging_simple .paginate_button.previous,
.paging_simple .paginate_button.next {
	background-image: linear-gradient(to right,#fbcabb,#ceb6d9);
	border-radius: 20px;
	margin: 20px;
}

.paging_simple .paginate_button.previous:before,
.paging_simple .paginate_button.next:after {
	text-shadow: none !important;
	font-size: 20px;
	vertical-align: middle !important;
}

.paging_simple .paginate_button.previous:before {
	content: '\003C' !important;
}

.paging_simple .paginate_button.next:after {
	content: '\003E' !important;
}

.paging_simple .paginate_button.previous,
.paging_simple .paginate_button.previous:before,
.paging_simple .paginate_button.next {
	padding: 20px 60px;
}

.paginate_button:before,
.paginate_button:after {
	color: #fff;
}