I checked out an old project of mine and noticed that it was already centered. It turns out that CommonMark allows you to set
<div> tags as well!
So, the simplest solution for centering is currently (note the empty line after the opening
<div align="center"> # This is gonna be centered! </div>
The only CommonMark html object that supports centering (as far as I know) is when you center a table cell. First you might’ve thought about just making a table and then using
align="center", but the table won’t take up the entire width of the page, so you’d get a small table on the left hand side of the page, which wouldn’t solve our problem of wanting to center stuff relative to the page rather than the table.
To get around this we set the table width (not using CSS with an inline style tag since it’s not supported in CommonMark at the time of writing) to a large value that will take up way more than the total width of the page. Since the
max-width: CSS property of tables in Gitlab markdown is
100% it means that by setting a ridiculously high
width="" we’re essentially setting the table
100% by using only the allowed pure html
The markdown below if placed in e.g. README.md in your Gitlab project will result in a 100% width table with a centered image, title and description. The most notable part is that we’re setting
width="9999" on the
<td> element in the table.
<table align="center"><tr><td align="center" width="9999"> <img src="/icon.png" align="center" width="150" alt="Project icon"> # MyProject Description for my awesome project </td></tr></table> ... More content