<style> .testimonial { margin: 0; background: #B7EDFF; padding: 10px 50px; position: relative; font-family: Georgia, serif; color: #666; border-radius: 5px; font-style: italic; text-shadow: 0 1px 0 #ECFBFF; background-image: linear-gradient(#CEF3FF, #B7EDFF); width:400px; } .testimonial:before, .testimonial:after { content: "\201C"; position: absolute; font-size: 80px; line-height: 1; color: #999; font-style: normal; } .testimonial:before { top: 0; left: 10px; } .testimonial:after { content: "\201D"; right: 10px; bottom: -0.5em; } .arrow-down { width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 15px solid #B7EDFF; margin: 0 0 0 25px; } .testimonial-author { margin: 0 0 0 25px; font-family: Arial, Helvetica, sans-serif; color: #999; text-align:left; } .testimonial-author span { font-size: 12px; color: #666; } </style> <blockquote class="testimonial"> <p>Nullam non wisi a sem semper eleifend. Pellentesque habitant morbi tristique senectus et netus et male</p> </blockquote> <div class="arrow-down"></div> <p class="testimonial-author">adipiscin</span></p>
article
Friday, June 14, 2013
Create CSS Testimonial
Create CSS Testimonial