"Test"
Bootstrap 4.1.1 Snippet by Kaciw03

Post to Facebook Tweet this

<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 ----------> <!DOCTYPE html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content=""> <link rel="icon" href="../../../../favicon.ico"> <title>Narrow Jumbotron Template for Bootstrap</title> <!-- Bootstrap core CSS --> <link href="../../css/editor.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href="narrow-jumbotron.css" rel="stylesheet"> </head> <body> <div class="container"> <div class="header clearfix"> <nav> <ul class="nav nav-pills float-right"> <li class="nav-item"> <a class="nav-link" href="#">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Profil</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Project</a> </li> <li class="nav-item"> <a class="nav-link active" href="#">Contact <span class="sr-only">(current)</span></a> </li> </ul> </nav> <h3 class="text-muted">Portofolio</h3> </div> <main role="main" class="container"> <div class="my-3 p-3 bg-white rounded box-shadow"> <h6 class="border-bottom border-gray pb-2 mb-0">Suggestions</h6> <div class="media text-muted pt-3"> <img src="https://bootsnipp.com/bootstrap-builder/libs/builder/icons/image.svg" height="32" width="32" style=""> <div class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray"> <div class="d-flex justify-content-between align-items-center w-100"> <strong class="text-gray-dark">Full Name</strong> <a href="#">Follow</a> </div> <span class="d-block">@username</span> </div> </div> <div class="media text-muted pt-3"> <img src="https://bootsnipp.com/bootstrap-builder/libs/builder/icons/image.svg" height="32" width="32" style=""> <div class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray"> <div class="d-flex justify-content-between align-items-center w-100"> <strong class="text-gray-dark">Full Name</strong> <a href="#">Follow</a> </div> <span class="d-block">@username</span> </div> </div> <div class="media text-muted pt-3"> <img src="https://bootsnipp.com/bootstrap-builder/libs/builder/icons/image.svg" height="32" width="32" style=""> <div class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray"> <div class="d-flex justify-content-between align-items-center w-100"> <blockquote class="blockquote text-right"> <strong class="text-gray-dark">Full Name</strong> <a href="#">Follow</a> </blockquote></div> <blockquote class="blockquote text-right"> <a href="#">Follow</a> <footer class="blockquote-footer">Ali Bin Abi Thalib</footer> </blockquote> </div> <small class="d-block text-right mt-3"> </small> </div><a> </a></div></main></div><a> <!-- Bootstrap core JavaScript ================================================== --> <!-- Placed at the end of the document so the pages load faster --> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="../../js/vendor/popper.min.js"></script> <script src="../../js/bootstrap.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/holderjs@2.9.4/holder.js"></script> <script src="offcanvas.js"></script> <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" preserveAspectRatio="none" style="display: none; visibility: hidden; position: absolute; top: -100%; left: -100%;"><defs><style type="text/css"></style></defs><text x="0" y="2" style="font-weight:bold;font-size:2pt;font-family:Arial, Helvetica, Open Sans, sans-serif">32x32</text></svg></a></body> </html>

Related: See More

BLK• Design System

Questions / Comments: