Pagination CSS Style

  • Resolved toodles53562

    (@toodles53562)


    2 years, 6 months ago

    Hello,
    I can’t get the pagination to look right. I looked through the forum and found some css, but the arrow in front of “Previous” is not even with the arrow to the right of Next.
    how can I change the text color of Previous and Next.
    And lastly, how do I get rid of the drop shadow on the arrows?

    Thank you!

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    Please try this optimized and reduced “Custom CSS”:

    .dataTables_paginate a {
	font-family: Montserrat;
	font-size: 14px;
	color: #ffffff !important;
	text-decoration: none !important;
	text-transform: uppercase;
	font-weight: bold;
}
.paging_simple .paginate_button.previous,
.paging_simple .paginate_button.next {
	background-image: linear-gradient(to right,#aad240,#aad240);
	border-radius: 15px;
	padding: 10px 40px;
}

.paging_simple .paginate_button.previous:before,
.paging_simple .paginate_button.next:after {
	text-shadow: none;
}

.paging_simple .paginate_button.previous:before {
    padding: 0 40px;
}

.tablepress-id-1 .row-1 td,
.tablepress-id-1 .row-2 td
.tablepress-id-1 .row-23 td,
.tablepress-id-1 .row-31 td,
.tablepress-id-1 .row-37 td,
.tablepress-id-1 .row-42 td,
.tablepress-id-1 .row-54 td,
.tablepress-id-1 .row-71 td {
	font-weight: bold;
}

    Essentially, the arrow needs a different padding, compared to what you were setting.

    Regards,
    Tobias

    Thread Starter toodles53562

    (@toodles53562)

    THANK YOU SO VERY MUCH. this is perfect! Love your plugin!!

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    no problem, you are very welcome! ?? Good to hear that this helped!

    Best wishes,
    Tobias
    ?
    P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Pagination CSS Style’ is closed to new replies.