SearchMenu

Demo post — blockquotes

This is the third post with tests and demo for blockquotes with code snippets and explanations

Let`s go!

Blockquotes

    
    <blockquote class="bq bq_align-center">
        <p>Lorem ipsum dolor sit amet</p>
        <cite><a rel="nofollow" href="http://www.lipsum.com/">Lorem Ipsum is simply dummy text</a></cite>
    </blockquote>                
    
Centered full width blockquote with link

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.

Lorem Ipsum is simply dummy text of the printing and typesetting industry




    <blockquote class="bq bq_align-left">
        <p> Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes</p>
        <cite><a rel="nofollow" href="http://www.lipsum.com/">Lorem Ipsum is simply dummy text</a></cite>
    </blockquote>                
    
Left-aligned full width blockquote with link

Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.

Lorem Ipsum is simply dummy text of the printing and typesetting industry



 
    <blockquote class="bq bq_align-left bq_pos-left">
        <p> Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes</p>
    </blockquote>               
    
Left-aligned, left-floated blockquote without link

Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.

Sed mattis ultricies odio eget luctus. Duis quam neque, auctor at ante ut, pretium dictum justo. Phasellus ligula lorem, pharetra ut dapibus id, posuere eget massa. Sed in mauris ultricies, euismod nisi a, pharetra est. Mauris vitae porta diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla malesuada posuere posuere. Nullam adipiscing lacinia odio, sed bibendum leo scelerisque id. Proin eu egestas metus, quis semper mauris. Cras arcu ligula, hendrerit ac tempus ac, porta nec odio. Vivamus sed risus quis nisl aliquam egestas quis in est. Phasellus id nisl vitae ante iaculis convallis venenatis non diam.


    <blockquote class="bq bq_align-right bq_pos-right">
        <p> Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes</p>
    </blockquote>                
    
Right-aligned, right-floated blockquote without link

Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.

Nullam adipiscing enim mattis purus pretium, in vestibulum enim lacinia. Fusce tellus nunc, facilisis vitae facilisis commodo, laoreet ut dui. Sed a arcu imperdiet, mollis velit et, auctor nisi. Donec porttitor dapibus interdum. Morbi imperdiet varius lobortis. Ut accumsan lacus ac laoreet vestibulum. Aliquam facilisis at ipsum vel lobortis. Nunc sed cursus elit. Nullam sodales, magna nec rutrum convallis, purus urna posuere nisl, eu dapibus nunc purus ac mi. Donec vel leo commodo, faucibus augue ac, gravida massa. Ut sagittis urna nec commodo vehicula. Duis nec consequat lectus, sit amet faucibus est. Nam a sagittis odio, eu mollis diam.


    <blockquote class="bq bq_align-right">
        <p> Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes</p>
        <cite><a rel="nofollow" href="http://www.lipsum.com/">Lorem Ipsum is simply dummy text</a></cite>
    </blockquote>                
    
Right-aligned full width blockquote with link

Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.

Lorem Ipsum is simply dummy text of the printing and typesetting industry




    <blockquote class="bq bq_align-center bq_pos-center bq_pos-center-extra">
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
    </blockquote>                
    
Centered blockquote with extra margins and without link

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.




    <blockquote class="bq bq_align-left bq_pos-left-extra">
        <p>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>
    </blockquote>                
    
Left-aligned, full width blockquote with extra margins and without link

Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.




    <blockquote class="bq bq_align-left bq_pos-left bq_pos-left-extra">
        <p> Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
        <cite><a rel="nofollow" href="http://www.lipsum.com/">Lorem Ipsum is simply dummy text</a></cite>
    </blockquote>                
    
Left-aligned, left-floated blockquote with extra margins and link

Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.

Lorem Ipsum is simply dummy text

Sed mattis ultricies odio eget luctus. Duis quam neque, auctor at ante ut, pretium dictum justo. Phasellus ligula lorem, pharetra ut dapibus id, posuere eget massa. Sed in mauris ultricies, euismod nisi a, pharetra est. Mauris vitae porta diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla malesuada posuere posuere. Nullam adipiscing lacinia odio, sed bibendum leo scelerisque id. Proin eu egestas metus, quis semper mauris. Cras arcu ligula, hendrerit ac tempus ac, porta nec odio. Vivamus sed risus quis nisl aliquam egestas quis in est.


    <blockquote class="bq bq_align-right bq_pos-right bq_pos-right-extra">
        <p>Nullam adipiscing lacinia odio, sed bibendum leo scelerisque id. Mauris vitae porta diam.</p>
        <cite><a rel="nofollow" href="http://www.lipsum.com/">Lorem Ipsum is simply dummy text</a></cite>
    </blockquote>                
    
Right-aligned, right-floated blockquote with extra margins and link

Nullam adipiscing lacinia odio, sed bibendum leo scelerisque id. Mauris vitae porta diam.

Lorem Ipsum is simply dummy text

Sed mattis ultricies odio eget luctus. Duis quam neque, auctor at ante ut, pretium dictum justo. Phasellus ligula lorem, pharetra ut dapibus id, posuere eget massa. Sed in mauris ultricies, euismod nisi a, pharetra est. Mauris vitae porta diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla malesuada posuere posuere. Nullam adipiscing lacinia odio, sed bibendum leo scelerisque id. Proin eu egestas metus, quis semper mauris. Cras arcu ligula, hendrerit ac tempus ac, porta nec odio.

 
    <blockquote class="bq bq_align-right bq_pos-right-extra">
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
    </blockquote>               
    
Right-aligned, full width blockquote with extra margins and without link

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.


Share this post

If you like this post why don`t you share it with your friends?