cssOMS/tests/app/article.php

<div class="row">
    <div class="col-xs-12">
        <section class="portlet">
            <div class="portlet-body">
                <article>
                    <h1>Text</h1>
                    <p><span class="tooltip">Tooltip<i>My Tooltip asd a sd <br>asdfsdf adf asd</i></span> ipsum dolor sit amet,
                        consectetur adipiscing elit. Duis posuere, nulla eu condimentum eleifend, nulla magna viverra risus, ut
                        faucibus libero libero nec est. Nunc quis rhoncus est, ac sodales lorem. Suspendisse convallis, massa eu
                        <a href="#">volutpat</a> posuere, justo dolor porta dui, a ullamcorper ex ipsum eget arcu. Cras quis
                        ante placerat, tempus orci vitae, semper nunc. Vestibulum <del>ante ipsum primis in</del> faucibus orci luctus et ultrices posuere
                        cubilia Curae; Duis at sodales sapien. Morbi dolor <mark>risus, finibus ut ipsum</mark> non, pellentesque varius ex. Etiam
                        pretium tempus diam at eleifend. Quisque a <strong>tortor et nisi commodo</strong> pretium ac at erat. Nam non iaculis
                        ipsum, ultrices tempus nisl. Pellentesque <em>ornare tellus vehicula sapien</em> fringilla cursus. Duis sed tellus
                        sagittis elit accumsan placerat et nec ex. In sit amet blandit nunc, a pulvinar nunc. Phasellus vulputate
                        facilisis lorem eget aliquet. Curabitur odio ante, <ins>lobortis vitae est at</ins>, consequat posuere elit.</p>

                    <p><span class="tooltip">Lorem<i>My Tooltip asd a sd asdfsdf adf asd</i></span> sed nulla et ante
                        consectetur dictum. Nunc molestie ligula eget felis tincidunt suscipit. Fusce scelerisque diam lectus, non faucibus
                        ligula sagittis eu. Sed id porttitor purus. Donec in dolor scelerisque, suscipit metus in, molestie sem.
                        Nulla facilisi. Nunc eu lobortis tellus.</p>
                    <blockquote>This is a blockquote</blockquote>

                    <h2>Image</h2>
                    <img src="http://thecodeplayer.com/uploads/media/40Ly3VB.jpg" width="200">

                    <h2>Enlarge (click)</h2>
                    <p>
                        <img tabindex="0" width="150px" src="http://thecodeplayer.com/uploads/media/40Ly3VB.jpg" alt="">
                        <img tabindex="0" width="150px" src="http://thecodeplayer.com/uploads/media/3yiC6Yq.jpg" alt="">
                        <img tabindex="0" width="150px" src="http://thecodeplayer.com/uploads/media/00kih8g.jpg" alt="">
                        <img tabindex="0" width="150px" src="http://thecodeplayer.com/uploads/media/2rT2vdx.jpg" alt="">
                        <img tabindex="0" width="150px" src="http://thecodeplayer.com/uploads/media/40Ly3VB.jpg" alt="">
                    </p>

                    <h2>Ordered List</h2>
                    <ol>
                        <li>one</li>
                        <li>two</li>
                    </ol>
                    <p>repeating numbers:</p>
                    <ol>
                        <li>one</li>
                        <li>two</li>
                        </ol>
                        <p>large numbers:</p>
                        <ol start="123">
                        <li>one</li>
                    </ol>

                    <h3>Unordered List</h3>
                    <ul>
                        <li>first element</li>
                        <li>second element</li>
                        <ul>
                            <li>next level</li>
                        </ul>
                    </ul>

                    <h4>Code</h4>
                    <p>This is a <code>inline codespan</code> with text in front and at the end.</p>

                    <h5>Code</h5>
                    <pre><code>&lt;?php

                    $message = 'fenced code block';
                    echo $message;</code></pre>
                    <pre><code class="language-php">echo 'language identifier';</code></pre>
                    <h6>Table</h6>
                    <table>
                            <caption>Table Title</caption>
                            <thead>
                            <tr>
                                <td>Col1 Title</td>
                                <td>Col2 Title</td>
                                <td>Col3 Title</td>
                                <td>Col4 Title</td>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>Col1</td>
                                <td>Col2</td>
                                <td>Col3</td>
                                <td>Col4</td>
                            </tr>
                            <tr>
                                <td>Col1</td>
                                <td>Col2</td>
                                <td>Col3</td>
                                <td>Col4</td>
                            </tr>
                            <tr>
                                <td>Col1</td>
                                <td>Col2</td>
                                <td>Col3</td>
                                <td>Col4</td>
                            </tr>
                            <tr>
                                <td>Col1</td>
                                <td>Col2</td>
                                <td>Col3</td>
                                <td>Col4</td>
                            </tr>
                            </tbody>
                        </table>

                </article>
            </div>
        </section>
    </div>
</div>