Bootstrap framework snippet Coupon Alert Boxes

This bootstrap framework snippet "Coupon Alert Boxes" was designed to help people of all skill levels - designer or developer,
huge nerd or early beginner. copy and paste the code. Use it as a complete kit or use it to start something more complex.
tags: coupon,boxes


<div class="container bootstrap snippet"> <div class="row"> <div class="col-md-5"> <div class="alert alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> <div class="alert alert-info alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> <div class="alert alert-success alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> <div class="alert alert-warning alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> <div class="alert alert-danger alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> </div> <div class="col-md-5"> <div class="alert alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> <div class="alert alert-info alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> <div class="alert alert-success alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> <div class="alert alert-warning alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> <div class="alert alert-danger alert-coupon"> <h4>Special Offer from JES and Ice-O-Matic</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos a similique dicta modi minus nostrum magnam provident reprehenderit in quae.</p> </div> </div> </div> </div>
body{margin-top:20px;} body { padding: 50px; } .alert-coupon { border: 1px dashed; h1, h2, h3, h4, h5, h6 { font-size: 20px; line-height: 1.5; text-align: center; } p:last-child { margin-bottom: 0; } }

Creator of this snippet

Dey Dey

Bootstrap version: 3.1.0

Created: May 4th 2014, 17:35

Views: 2.8K