if it isn’t the simple matter of adding a space:
a:last-child:after{
content: " | ";
}
//--or--
//you forgot to define what happens before the "|"
a:last-child:before{
content: "| ";
}
//perhaps the browser doesn't know what to do in this case
//it most likely will print or 'echo' the next <p> it sees
//in the stack it won't insert a " " unless you tell it too
then look at the footer in your browser, right-click to “Inspect element” and determine the source of this missing space… you’ll have to backtrace the stylesheet to the root of the problem, either you’ll be looking at footer.php, style.css, possibly functions.php and you may want to look at the design docs too if you don’t explicity know what each line of script does.
On “view source, under sources, you can isolate the exact line of code generated by your browser that is producing the unwanted footer text. Most browsers will ID the file (style.css) and which line of the stylesheet is referenced in order to create the bad footer text.
You can also manually override bad style or unwanted PHP in a “view source” window. Add the space manually to the page’s source and get it to look right. This doesn’t fix the page (only the current instance of it) but in doing so it will help you ID the source of the problem.
On an aesthetic note, if you want it to look like this:
Sales | Privacy Policy | Page X | Page Y | Page Last
Then you’ll need a little extra code to ID “Sales” is the 1st link and “PageLast” is the final link, otherwise the script will make it look like this:
| Sales | Privacy Policy | PageX | PageY | PageLast | and I’m guessing you don’t want that.
