Links not working when using custom css file

I created a custom obsidian.css file

.poetry {
    text-align: center;
	color: green;
}

and used in one of my notes

Default style text....

<div class="poetry">
Green centered text ![[Image.jpg]]
</div>

The problem is that the parts of the note where I use custom CSS internal links, bullet points etc don’t work. What can I do to keep all those feautures while styling my note with css?

This is not a bug. It’s how it works. I am gonna redirect this to the help section

1 Like

Yes, so you can’t use Obsidian link syntax inside of html. You could use an <img> tag, but the image would need to be publicly hosted.

1 Like

How can we publically host it?

Image positioning is pretty useful.

I’m able to position images from url links but not from the vault.

That’s a short question with a long answer. You could use a cloud storage app or image hosting service, but you would have to decide whether it’s worth the trouble.

Are you talking about the new “image sizing” feature? Can you give an example?

I wasn’t aware of that image sizing feature.

It’s just an old CSS trick I used to have to center my .md images

this: img[src*="#center"]{ code }

allows me to do this: ![](image.png#center)

.png was just an example; other formats work too.

But yeah, that works for URL links, but not for images in my vault.