Home › Forums › Support › nav-previous and nav-next arrow styling This topic has 7 replies, 4 voices, and was last updated 6 years, 1 month ago by Leo. Viewing 8 posts - 1 through 8 (of 8 total) Author Posts January 9, 2018 at 4:43 pm #467090 Robert I found Tom’s code which puts the previous and next links on a single line. How would I get the next arrow to float all the way to the right of the next link? And how would I change the arrow to some other character? .post-navigation .nav-previous { float: left; } .post-navigation .nav-next { float: right; } January 9, 2018 at 10:40 pm #467260 TomLead Developer Lead Developer You can move the arrow like this: .nav-next .next:before { display: none; } .nav-next .next:after { content: "\f105"; font-family: FontAwesome; padding-left:10px } You can change the arrow to something else using the content CSS attribute. What are you hoping to replace them with? January 10, 2018 at 5:27 am #467453 Robert Let’s say I want to use fa-caret-left and fa-caret-right… January 10, 2018 at 10:21 am #467795 TomLead Developer Lead Developer Try this: .nav-next .next:after { content: "\f0da"; font-family: FontAwesome; padding-left:10px } .nav-previous .prev:after { content: "\f0d9"; font-family: FontAwesome; } January 10, 2018 at 10:46 am #467809 Robert Thanks! January 10, 2018 at 11:23 am #467834 TomLead Developer Lead Developer You’re welcome π February 8, 2018 at 7:41 am #491390 blackbird Perfect!! Just what I was looking for! And the arrow all the way to the right, yes. Happy π February 8, 2018 at 9:35 am #491463 LeoStaff Customer Support Glad you are able to find the answer through our forum π Author Posts Viewing 8 posts - 1 through 8 (of 8 total) You must be logged in to reply to this topic. Log In Username: Password: Keep me signed in Log In