adrigm
5/17/2018 - 1:01 AM

Panel card

<div class="container-fluid">
    <!-- add extra container element for Packery -->
    <div class="grid">
        <!-- add sizing element for columnWidth -->
        <div class="grid-sizer col-md-6 col-xl-4">s</div>
        <!-- items use Bootstrap .col- classes -->
        <div class="grid-item col-md-6 col-xl-4">
            <!-- wrap item content in its own element -->
            <div class="grid-item-content">
                <div class="card">
                    <div class="card-header handle">
                        <h4>Card Title</h4>
                    </div>
                    <div class="card-body">
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatum enim sapiente placeat repellat neque sed, iusto iure optio qui rem porro in exercitationem ipsa modi quis fugiat dolores. Eos, impedit.</p>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatum enim sapiente placeat repellat neque sed, iusto iure optio qui rem porro in exercitationem ipsa modi quis fugiat dolores. Eos, impedit.</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="grid-item col-md-6 col-xl-4">
            <div class="grid-item-content">
                <div class="card">
                    <div class="card-header handle">
                        <h4>Card Title</h4>
                    </div>
                    <div class="card-body">
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatum enim sapiente placeat repellat neque sed, iusto iure optio qui rem porro in exercitationem ipsa modi quis fugiat dolores. Eos, impedit.</p>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatum enim sapiente placeat repellat neque sed, iusto iure optio qui rem porro in exercitationem ipsa modi quis fugiat dolores. Eos, impedit.</p>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatum enim sapiente placeat repellat neque sed, iusto iure optio qui rem porro in exercitationem ipsa modi quis fugiat dolores. Eos, impedit.</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="grid-item col-md-6 col-xl-4">
            <div class="grid-item-content">
                <div class="card">
                    <div class="card-header handle">
                        <h4>Card Title</h4>
                    </div>
                    <div class="card-body">
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatum enim sapiente placeat repellat neque sed, iusto iure optio qui rem porro in exercitationem ipsa modi quis fugiat dolores. Eos, impedit.</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="grid-item col-md-6 col-xl-4">
            <div class="grid-item-content">
                <div class="card">
                    <div class="card-header handle">
                        <h4>Card Title</h4>
                    </div>
                    <div class="card-body">
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatum enim sapiente placeat repellat neque sed, iusto iure optio qui rem porro in exercitationem ipsa modi quis fugiat dolores. Eos, impedit.</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="grid-item col-md-6 col-xl-4">
            <div class="grid-item-content">
                <div class="card">
                    <div class="card-header handle">
                        <h4>Card Title</h4>
                    </div>
                    <div class="card-body">
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatum enim sapiente placeat repellat neque sed, iusto iure optio qui rem porro in exercitationem ipsa modi quis fugiat dolores. Eos, impedit.</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="grid-item col-md-6 col-xl-4">
            <div class="grid-item-content">
                <div class="card">
                    <div class="card-header handle">
                        <h4>Card Title</h4>
                    </div>
                    <div class="card-body">
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatum enim sapiente placeat repellat neque sed, iusto iure optio qui rem porro in exercitationem ipsa modi quis fugiat dolores. Eos, impedit.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>