Page Comparison

{div2:class=fl-col-fixed fl-force-left}
{include:FSS text examples navigation}
{div2}

{div2:class=fl-col-flex}

h2. Text alignment

{html}
<div class="fl-container-250 fl-centered">
    <p class="fl-text-align-left">This text is left-aligned.</p>
    <p class="fl-text-align-right">This text is right-aligned.</p>
    <p class="fl-text-align-center">This text is center-aligned.</p>
    <p class="fl-text-align-justify">This text is justified. Phasellus facilisis porta sem id placerat. Donec eu viverra erat. In quis velit leo, ac imperdiet lectus. Sed cursus ultrices turpis, quis fermentum neque convallis nec.</p>
</div>
{html}

The markup and classes used to produce this example:

{code:html}
<div class="fl-container-250 fl-centered">
    <p class="fl-text-align-left">This text is left-aligned.</p>
    <p class="fl-text-align-right">This text is right-aligned.</p>
    <p class="fl-text-align-center">This text is center-aligned.</p>
    <p class="fl-text-align-justify">This text is justified.
           Phasellus facilisis porta sem id placerat. Donec eu viverra erat.
           In quis velit leo, ac imperdiet lectus. Sed cursus ultrices turpis,
           quis fermentum neque convallis nec.</p>
</div>
{code}

NOTE: The {{fl-text-align-*}} classes are applied to the paragraph tags and so apply only that paragraph. The class could be applied to a {{<div>}} surrounding many paragraphs to apply the style to all paragraphs.

{div2}