Как вы центрируете текст в уценке Gitlab? - PullRequest
0 голосов
/ 13 ноября 2018

После того, как Gitlab переключил свой механизм уценки на CommonMark, уже не так просто добавлять такие вещи, как пользовательский стиль, в ваши файлы уценки.

Я использовал Gitlab некоторое время и дольше всего мне понравилоськак хорошо я смогу сделать так, чтобы мой файл README.md выглядел центрированным значком, заголовком и описанием для моего проекта.Когда они переключили движок, все мои файлы уценки, которые основывались на таких стилях, выглядели очень плохо.

Как мне центрировать текст в Gitlab после перехода на CommonMark?

1 Ответ

0 голосов
/ 13 ноября 2018

Обновление

Я проверил свой старый проект и заметил, что он уже центрирован. Оказывается, CommonMark позволяет вам также установить align="center" на <div> теги!

Итак, самое простое решение для центрирования на данный момент (обратите внимание на пустую строку после открытия <div>:

<div align="center">

# This is gonna be centered!
</div>

Оригинал

Единственный html-объект CommonMark, который поддерживает центрирование (насколько я знаю), это когда вы центрируете ячейку таблицы. Сначала вы могли подумать о том, чтобы просто создать таблицу и затем использовать align="center", но таблица не займет всю ширину страницы, поэтому вы получите небольшую таблицу в левой части страницы, что не решило бы нашу проблему желания центрировать материал относительно страницы, а не таблицы.

Чтобы обойти это, мы устанавливаем ширину таблицы (без использования CSS с тегом встроенного стиля, поскольку он не поддерживается в CommonMark на момент написания) к большому значению, которое будет занимать намного больше, чем общая ширина страницы , Так как CSS-свойство max-width: таблиц в уценке Gitlab равно 100%, это означает, что, устанавливая смехотворно высокое значение width="", мы по существу устанавливаем для таблицы width: значение 100%, используя только разрешенный чистый HTML * 1021. * собственность.

Уценка ниже, если она размещена, например, в. README.md в вашем проекте Gitlab приведет к таблице 100% ширины с центрированным изображением, заголовком и описанием. Наиболее примечательным является то, что мы устанавливаем width="9999" для элемента <td> в таблице.

<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

Ниже вы можете увидеть пример того, как ваш файл README.md может выглядеть на Gitlab, используя приведенную выше уценку. README.md file rendered on Gitlab

...