Cards

<div class="card m-b-30">
    <div class="card-header">
        <h5 class="card-title m-b-0">Card title</h5>
​
    </div>
    <div class="card-body">
​
        <p class="card-text">Some quick example text to build on the card title and make up the bulk
            of the card's content.</p>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem cupiditate deleniti
            dolore exercitationem explicabo facere ipsa itaque iusto, maiores minima modi molestias
            nobis optio provident quas repudiandae tempore temporibus, voluptatem.
        </p>
    </div>
    <div class="card-footer">
        <a href="#!" class="btn btn-primary">Link</a>
    </div>
</div>
​

 <div class="card">
    <div class="card-header">
        <h5 class="card-title m-b-0">Card title</h5>
​
        <div class="card-controls">
​
            <a href="#" class="js-card-fullscreen icon"></a>
            <a href="#" class="js-card-refresh icon"></a>
            <a href="#" class="js-card-close icon"></a>
            <div class="dropdown">
                <a href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i
                        class="icon mdi  mdi-dots-vertical"></i> </a>
​
                <div class="dropdown-menu dropdown-menu-right">
                    <button class="dropdown-item" type="button">Action</button>
                    <button class="dropdown-item" type="button">Another action</button>
                    <button class="dropdown-item" type="button">Something else here</button>
                </div>
            </div>
        </div>
    </div>
    <div class="card-body">
​
        <p class="card-text">Some quick example text to build on the card title and make up the bulk
            of the card's content.</p>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem cupiditate deleniti
            dolore exercitationem explicabo facere ipsa itaque iusto, maiores minima modi molestias
            nobis optio provident quas repudiandae tempore temporibus, voluptatem.
        </p>
    </div>
    <div class="card-footer">
        <a href="#!" class="btn btn-primary">Link</a>
    </div>
</div>
​

<div class="card ">
    <div class="card-header">
        <h5 class="card-title m-b-0">Scrollable Card</h5>
    </div>
    <div class="card-body card-scroll">
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem cupiditate deleniti
            dolore exercitationem explicabo facere ipsa itaque iusto, maiores minima modi
            molestias nobis optio provident quas repudiandae tempore temporibus, voluptatem.
        </p>
​
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem cupiditate deleniti
            dolore exercitationem explicabo facere ipsa itaque iusto, maiores minima modi
            molestias nobis optio provident quas repudiandae tempore temporibus, voluptatem.
        </p>
​
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem cupiditate deleniti
            dolore exercitationem explicabo facere ipsa itaque iusto, maiores minima modi
            molestias nobis optio provident quas repudiandae tempore temporibus, voluptatem.
        </p>
​
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem cupiditate deleniti
            dolore exercitationem explicabo facere ipsa itaque iusto, maiores minima modi
            molestias nobis optio provident quas repudiandae tempore temporibus, voluptatem.
        </p>
​
​
    </div>
    <div class="card-footer text-md-right">
        <a href="#!" class="btn btn-secondary">Link</a>
    </div>
</div>
​