bucketfish

<details style="z-index: -1">
<summary style="list-style: none">███████</summary>
<div style="background-color: white; margin-top: -28px; z-index: 1; position: relative; pointer-events: none;">here's a spoiler</div>
</details>

#css crimes

You must log in to comment.

in reply to @trashcataria's post:

sakiamu @sakiamu11/9/2022, 11:30 PM

I think you'd need to hook into hover selectors somehow, though given the other things I've seen pulled off, (like minesweeper), inline spoilers should be relatively small potatoes.

If you know how to CSS crime here. I have no practice on it yet.

in reply to @bucketfish's post:

🍬@Bonbon11/10/2022, 5:15 AM

Going to be clicking every ██████ that I see now bloop

Xoey @CandyCorvid11/10/2022, 5:49 AM

I tried the snippet but it doesn't seem to work for me? Maybe it's just the rendering in the post preview though. It shows the spoiled text as it should but doesn't hide the black bar

bucketfish @bucketfish11/10/2022, 5:52 AM

huh. that's strange! does my example post work? maybe play around with the background color or margin top, i think. or maybe it's the z-index. Hm. Weird.

Xoey @CandyCorvid11/10/2022, 6:55 AM

Yeah, your post works fine. I'll have to fiddle with those parameters later 🤔

Xoey @CandyCorvid11/10/2022, 7:27 AM

I know what the problem was. I was trying it inline, but it doesn't render properly unless it's on its own line

Tea @theia11/10/2022, 1:49 PM

tip: I gave my ███████ in a previous post letter-spacing:-1px to get rid of the seams

Pinned Tags

box arena game