"About Sample"
Bootstrap 4.1.1 Snippet by sparkktv

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <section class="about"><div class="about-grid"><div class="row"><div class="col-md-4 about-info"> <p class="about-header-about">About</p> <h3 class="about-header-showTitle">Air Fryin' with Aaron</h3> <p class="about-creator">Created by: Parem Diem</p></div> <div class="col-md-8 about-info"><div class="about-show"> <p class="about-copy">Every week Aaron shows you how to make a new dish in under 30 minutes inside the Air Fryer. A Sparkk TV Original Series.</p></div> <div class="showinfo"><h2 class="showinfotext">1 Season · <text class="tvrating">TV-PG</text> · 2021 · 4K</h2> </div></div></div></section>
body{width:1600px;color:#fff;margin-left:auto;margin-right:auto;margin-top:15px;} .about{background:rgba(0,0,0,.3);padding:15px 25px;border-radius:12px;box-shadow:3px 3px 20px 2px rgba(0,0,0,.1);} .about-info{margin-top:auto;margin-bottom:auto;} .about-header-about{margin-bottom:24px;font-size:20px;font-weight:400;line-height:24px;} .about-header-showTitle{margin-bottom:24px;font-size:32px;font-weight:700;line-height:38px;} .about-description{margin-bottom:12px;} .about-copy{font-size:16px;line-height:26px;-webkit-text-size-adjust:100%;} .showinfo{padding-top:15px;border-top:1px solid #fff;display:inline-block;} .showinfotext{font-size:18px;font-weight:700;} .tvrating{border:1px solid #fff;padding:0 7px;border-radius:4px;}

Related: See More


Questions / Comments: