Jekyll right align text

Question

How do you right align text in Jekyll?

I have a block of text I want to right align.

If it was HTML, I'd do something like:

style="text-align:right;"

How can I do that in Markdown with Jekyll?

score 7 · Accepted Answer · answered Jun 18 '14 at 07:40

7

Jekyll 2.0+ uses kramdown as a default markdown converter.

You can declare right align in your css:

.right{
     text-align: right;
}

Then, simply add after your paragraph:

This text is right aligned. {: .right}

answered Jun 18 '14 at 07:40

You may want to set the direction property instead of text-align – user1708860 Aug 22 '16 at 20:21

score 2 · Answer 2 · answered Jun 17 '14 at 06:39

2

You will have to use HTML tags for that, e.g. <p style="text-align: right">. Markdown can align table contents by putting a colon in the separator line (left, right, both ends), but not normal text, AFAIK.

answered Jun 17 '14 at 06:39

Rudy Velthuis

28,387
5
46
94

FWIW, that is why I prefer textile. It can do much more without HTML tags. It doesn't always look like a normal text anymore, but it is, IMO, much more powerful for markup, even more powerful than kramdown or multiMarkdown. – Rudy Velthuis Jun 17 '14 at 15:56

score 2 · Answer 3 · answered Nov 21 '14 at 19:57

2

Jekyll supports Textile language, so you can use the specific tags for paragraphs, in your case the tag to align on the right p>..

In the linked page:

p>. Aligned right paragraph.

answered Nov 21 '14 at 19:57

Vince

1,570
3
27
48

this requires a plugin, ie not out of the box – Rene Wooller Aug 06 '15 at 13:06

score 1 · Answer 4 · edited Jun 20 '20 at 09:12

As we known, Jekyll uses kramdown as a default markdown converter from 2.0+. And It doesn't support the table text alignment now, I think the below can help you.

1. The first solution is HTML and CSS (for normal block alignment):

a. using inline style:

<p style="text-align: right">Your awesome text</p>

b. using outer style:

.right {
   text-align: right;
}

and

<p class="right">Your awesome text</p>

or

Your awesome text. {: .right}

2. The second solution is Jekyll Plugin (for table alignment):

jekyll-spaceship - A Jekyll plugin to provide powerful supports for table, mathjax, plantuml, emoji, youtube, dailymotion, vimeo, etc.

https://github.com/jeffreytse/jekyll-spaceship

For now, these extended features are provided:

Cells spanning multiple columns

Cells spanning multiple rows

Cells text align separately

Table header not required

Grouped table header rows or data rows

Jekyll right align text

4 Answers4

Linked