'Center a hyperlink or an image in Docusaurus

I'm building a website with Docusaurus V2.

I have a file link:

[10Studio-Sample-EN.xlsx](https://www.10studio.tech/files/10Studio-Sample-EN.xlsx)

Now, I want to put that link in the center (traditionally with text-align: center).

I tried the following code:

export const Center = ({children}) => (
   <div
      style={{
         "textAlign": "center"
      }}>
      {children}
   </div>
)

<Center>hahahaha</Center>
<Center>[10Studio-Sample-EN.xlsx](https://www.10studio.tech/files/10Studio-Sample-EN.xlsx)</Center>

It returned this:

enter image description here

Does anyone know what's the easiest way to center a hyperlink (or an image)?



Solution 1:[1]

Use this one it is pretty simple.

<center>
<img src="..."></img>
</center>

Everything will be centered vertically.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Yash Panchal