-
Hey!
I have the date button in my post archive cards styled to display in a little yellow circle with white text. Since a few weeks, though, the CSS suddenly isn’t applying, and it just displays as plain text. I figured a plugin update caused a conflict, but I turned them all off and nothing changed.
Thinking now it may have something to do with the latest GP update OR I messed something up in the CSS that I’m not noticing. Any insights would be great! You can see the issue in the URL in the private box.
-
Hi there,
I assume there might be a syntax error in your custom CSS that could be causing it not to render.
What I would do is copy the entire custom CSS snippet and paste it into a CSS validator tool to check for any parsing errors. You can use https://www.cssportal.com/css-validator/
-
Hey sorry to bring this back to life but I looked at it again today and wackily enough, I identified the parent class and managed to display none it. But I still don’t have a clue how it happened, because this is what made it disappear:
.has-text-align-center { display: none !important; }How can that be the parent class? I went into the page source and I saw this same class for date blocks for the other posts too, but those didn’t display anywhere. I know this because their date formatting was wrong (i.e. “January 9, 2024” instead of “Jan 9”). Why are they in the page source, and why in the world is that their parent class?
I ask because I’d rather fix this issue than suppress it with CSS, my CSS file is already enough to make a grown man cry (see private info if login needed). In fact, it’s probably what’s making this happen, but I have no idea how.
This is the random floating date in action: https://prnt.sc/RBVmXLHt4E-0
-
How can that be the parent class?
As Alvind said, there might be a syntax error in your CSS, and you should check with the tool he linked.
Have you done that? And did you find the culprit?
I do not see the date on the homepage, this is what I see:
https://app.screencast.com/zQkGeRlVTBx67If the issue is not on the homepage, can you link us to the page in question?
-
The white homepage is a caching thing, I have no idea why it happens. Does it look normal now?
Yes, I ran it through the CSS tool. Unfortunately it outputs a lot of stuff that’s not so relevant, like telling me not to use !important or var(–global-color). But no issues that are labeled as hard errors, like parsing problems. The page in question is the blog page. The issue is not visible now since I suppressed it, so you’d have to remove the top bit of CSS to be able to see it.
Thanks!
-
Hi there,
edit the Query Loop on your archive page, inside the Query Loop block, there is a Post Template block, select that and in block settings Layout, set the Position to Relative.
-
Alright great thanks! I’ll give it a shot when I have a moment. 🙂
-
Let us know!
-
Sorry, I wrote a whole thing, but I fixed it now by targeting the rogue button more specifically:
.has-text-align-center.wp-block-post-date { display: none !important; }I did try to set the Post Template to relative (had to switch the whole archive template to GB blocks first), but that didn’t make a difference.
This whole template is so cursed. No matter what I do, it shows up incorrectly either on mobile or desktop.
-
Have you resolved the issue ?
-
Yes, it’s not ideal but at least the button is gone! Thanks.
-
Glad to hear that !
- You must be logged in to reply to this topic.