This is the thing! I had to adapt it to WorldAnvil which uses BBCode and has Limitations but it worked surprisingly well and now I like SVGs, a thing I never considered particularly liking before. love to put new things in the liking box
I would like to try to put text over an effect like this in order to be extremely extra about my character page headers. I got it working by using the "box with background image" example on this page as a template, but the text and the SVG image don't scale relative to each other. The text will be too small or too big, and often a different size on mobile.
I suspect it's because the code example there is not accounting for me doing something fucked up like
- creating a container that tells the text what to look like and places an image in the background, as god intended
- placing my text in that container, like an agreeable lad
- adding another image to said container in addition to the text, violating all known laws of nature.
I think my problem may be that there isn't anything telling the SVG what to do, specifically; it's just doing the same thing the text is because it's in the same container, neither of them know the other exists, and I'm missing code that tells one of them to check the other for what size to be. So I can correct how the text scales and get that working fine, but it'll screw up the size and positioning of the SVG (and vice versa).
but
What I would actually like to know before I fuck around with this any further: is there an obviously correct and straightforward way to do what I'm trying to do that I'm completely missing? It's basically just stacking a background image, an SVG cutout, and text in a way that keeps the text positioned on top of the SVG and pretty much the same size relative to it regardless of screen/window size.
Typically when I can get something to almost work and all my searches for how to do a simple thing are turning up vague answers like, "I guess you can do that, but you need JavaScript," my problem is actually that I don't know the right way to search for the answer and I'm wildly overcomplicating it.
I would be grateful for any advice, and please accept in advance my gratitude and uh [rummages] a cat.
