ComboStrap Styling - Align Attribute

Table of Contents

1 - About

align is an styling attribute of the HTML superset component

It permits to align:

If you want more control on the position, you may also use a grid

Fully operational, since version 1.4

3 - Type

3.1 - Block

How to align a block

The align attribute on a box, supports the values:

  • left (by default, the block is aligned to the left)
  • center,
  • right

Example: 

<note tip align="right"  width="300px">
=== Block to the right ===

As every block by default takes the whole available [[dimension|width]], you need to add a [[dimension|width attribute]] when you want to align it.

</note>

Block to the right

As every block by default takes the whole available width, you need to add a width attribute when you want to align it.

You can also align an image by passing the align parameter

3.2 - Text

How to align the text in a block component

The text-align attribute on a block, supports the value:

  • center
  • right
  • justify
  • left (default)

Example: 

<card text-align="center" width="300px">
=== Centered Text  ===

A text in the center

</card>

Centered Text

A text in the center

For the geek

This is just a CSS shortcut to the text-align CSS attribute

Powered by ComboStrap