Archived topic
Next and Previous in one row SVG
5 replies · Started by Marc on November 7, 2019
I have used this:
https://generatepress.com/forums/topic/next-previous-in-one-row/
But since the next and previous arrows are now SVG, I can't figure out how to get them in one row. I guess this has to be done in php?
thnx
Hi there,
Is the issue visible somewhere?
I just checked a post and the post navigation is indeed in one row:
https://www.screencast.com/t/DLcHlMrRN
Let me know :)
Thanks for the quick reply Leo,
I was toying around with it when you checked. I basically removed the svg using all of the following code:
.nav-next .next:after
{
content: "\f105";
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
display: inline-block;
text-decoration: inherit;
position: relative;
margin: 0 .6em;
width: 0px;
text-align: center;
color:#cccccc;
-webkit-font-smoothing:antialiased;
}.nav-next
{
float:right;
}.nav-previous
{
float:left;
}.nav-previous .prev:before
{
content: "\f104";
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
display: inline-block;
text-decoration: inherit;
position: relative;
margin: 0 .6em;
width: 13px;
text-align: center;
color:#cccccc;
opacity: 1;
}.nav-next .next:before
{
display: none;
}.nav-previous .icon-arrow svg,
.nav-next .icon-arrow svg
{
display: none;
}.nav-next, .nav-previous
{
display: inline;
}.nav-previous
{
color:#cccccc;
}
Still curious as how to do it using the svg though.
regards
Marc
Can I see the issue live somewhere?
Thanks :)
I got it working using Font awesome and hiding the SVGs.
This works for me, but I'm worried that it slows down loading time.
My real question is how can I get the same results with the svgs.
Thnx
I'm not sure what issues you are having with SVGs.
Can you show me?