Calling CSS Gurus - Wordpress Question

[Turtle Shed]

There are other ways, but I'm determined to do this with CSS because I think I should be able to.

On a standard Wordpress site, when a user is logged in, the class selector "logged-in" appears in the main body div. I want to show/hide a login/logout link based on whether that class is in use (in other words, whether or not someone is logged in).

My login and logout links will have class selectors assigned, namely "member-log-out" and "member-log-in" so that I can specifically target them.

I can easily hide the login link like this:

.logged-in .member-log-in {
display: none;
}

But I think I should be able to use the ":not()" CSS rule to hide the logout link when someone is not logged in

Would be a doddle if Wordpress added "logged-out" as a selector when nobody was logged in, but they don't.

So PH minds, can this be achieved? I'm struggling.

[maffski]

Just default the logout to be hidden and use the logged-in class to make it visible.

[Turtle Shed]

maffski said:

Just default the logout to be hidden and use the logged-in class to make it visible.

Thanks, yes I can do that, but it's the opposite situation that I can't figure out. How to hide "logout" when someone isn't logged in.

Logged in? > See only logout link
Logged out? > Only see login link

There are other ways for sure, but if I can do it with a bit of CSS it will be something that I understand the workings of, and I will have learned something.

Edit to add that I sorted it. Found an answer on the web after a surprisingly large amount of digging.

Edited by Turtle Shed on Sunday 5th November 21:13

[maffski]

Turtle Shed said:

Thanks, yes I can do that, but it's the opposite situation that I can't figure out. How to hide "logout" when someone isn't logged in.
...snip

No, remember you can always approach any condition from two directions:

how do I hide this when someone isn't logged in

can be

how do I show this when someone is logged in

Default to it not being visible and make it visible when you need it.