ebkod
ebkod

Reputation: 103

How do I style a WordPress PHP link?

<div class="past-page"><?php previous_posts_link( '&laquo; Previous Page' ); ?></div>

Hello! I'm having a bit of troubles trying to solve the styling of a pagination button. I tried styling the past-page div, but that made a white box show up when no link was there... which was not the result I wanted.

So, I'm wondering if I can somehow add styling in the php tag here? The style I want to add is

font-size: 10pt;
text-transform: uppercase;
font-weight: bold;
background: #fff;
padding: 10px;

Upvotes: 0

Views: 45

Answers (1)

Nerds of Technology
Nerds of Technology

Reputation: 197

use :not(:empty) to add style to a div that is 'not empty'; otherwise, when it is blank, it reverts back to the default CSS:

<style>
.past-page:not(:empty) {
 font-size: 10pt;
 text-transform: uppercase;
 font-weight: bold;
 background: #fff;
 padding: 10px;
}
</style>

Alternatively, you could apply the style always unless empty then make it invisible:

<style>
.past-page {
 font-size: 10pt;
 text-transform: uppercase;
 font-weight: bold;
 background: #fff;
 padding: 10px;
}

.past-page:empty {
 display: none !important;
}
</style>

Upvotes: 1

Related Questions