{"route":"/en-US-v0.14.1/reference/layout/align/","title":"Align","description":"Documentation for the `align` function.","part":null,"outline":[{"id":"summary","name":"Summary","children":[]},{"id":"example","name":"Example","children":[]},{"id":"combining-alignments","name":"Combining alignments","children":[]},{"id":"nested-alignment","name":"Nested alignment","children":[]},{"id":"alignment-within-the-same-line","name":"Alignment within the same line","children":[]},{"id":"parameters","name":"Parameters","children":[{"id":"parameters-alignment","name":"alignment","children":[]},{"id":"parameters-body","name":"body","children":[]}]}],"body":{"kind":"func","content":{"path":[],"name":"align","title":"Align","keywords":[],"oneliner":"Aligns content horizontally and vertically.","element":true,"contextual":false,"deprecationMessage":null,"deprecationUntil":null,"details":[{"kind":"html","content":"

Aligns content horizontally and vertically.

\n

Example

\n

Let's start with centering our content horizontally:

\n
#set page(height: 120pt)\n#set align(center)\n\nCentered text, a sight to see \\\nIn perfect balance, visually \\\nNot left nor right, it stands alone \\\nA work of art, a visual throne\n
\"Preview\"
\n

To center something vertically, use horizon alignment:

\n
#set page(height: 120pt)\n#set align(horizon)\n\nVertically centered, \\\nthe stage had entered, \\\na new paragraph.\n
\"Preview\"
\n

Combining alignments

\n

You can combine two alignments with the + operator. Let's also only apply\nthis to one piece of content by using the function form instead of a set\nrule:

\n
#set page(height: 120pt)\nThough left in the beginning ...\n\n#align(right + bottom)[\n  ... they were right in the end, \\\n  and with addition had gotten, \\\n  the paragraph to the bottom!\n]\n
\"Preview\"
\n

Nested alignment

\n

You can use varying alignments for layout containers and the elements within\nthem. This way, you can create intricate layouts:

\n
#align(center, block[\n  #set align(left)\n  Though centered together \\\n  alone \\\n  we \\\n  are \\\n  left.\n])\n
\"Preview\"
\n

Alignment within the same line

\n

The align function performs block-level alignment and thus always\ninterrupts the current paragraph. To have different alignment for parts\nof the same line, you should use fractional spacing instead:

\n
Start #h(1fr) End\n
\"Preview\"
"}],"self":false,"params":[{"name":"alignment","details":[{"kind":"html","content":"

The alignment along both axes.

"},{"kind":"example","content":{"body":"
#set page(height: 6cm)\n#set text(lang: "ar")\n\nمثال\n#align(\n  end + horizon,\n  rect(inset: 12pt)[ركن]\n)\n
\"Preview\"
","title":null}}],"types":["alignment"],"strings":[],"default":"start + top","positional":true,"named":false,"required":false,"variadic":false,"settable":true},{"name":"body","details":[{"kind":"html","content":"

The content to align.

"}],"types":["content"],"strings":[],"default":null,"positional":true,"named":false,"required":true,"variadic":false,"settable":false}],"returns":["content"],"scope":[]}}}