"NSCN Home redesign"
Bootstrap 3.0.0 Snippet by wondermarq

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container" style="padding:5em 0;"> <div class="row"> <div class="col-md-8"> <div class="featured"> <a href="#"> <img src="http://via.placeholder.com/800x480" class="img-responsive"> <div class="post-title"> <span>This is a title</span> </div> </a> </div> </div> <div class="col-md-4"> <div class="featured-side-container"> <div class="featured-side"> <a href="#"><img src="http://via.placeholder.com/116x78" class="img-responsive"><span>Unstick your job search, October 25, 2017</span></a> </div> <div class="featured-side"> <a href="#">STAYING FOCUSED, STAYING CONFIDENT; UPCOMING NSCN WEBINARS; STATE OF WORKFORCE DIVERSITY: AGE DISCRIMINATION IN HIRING AND CHIEF DIVERSITY OFFICERS; UPCOMING EVENTS LISTSERV</a> </div> <div class="featured-side"> <a href="#">We received the following job listing from Community Blood Services for two Registered Nurses.</a> </div> </div> </div> </div> </div>
.featured { position:relative; } .post-title { position:absolute; bottom:0; background:rgba(0,0,0,.4); width:100%; padding:1em; font-size:18px; text-transform:uppercase; } .featured a { color:#fff; } .featured-side { margin:10px 0; padding:10px 0; border-bottom:1px solid #ccc; min-height:120px; vertical-align:middle; } .featured-side a { font-size:18px; color:#000; text-transform:uppercase; } .featured-side a:hover { color:#e51837; text-decoration:none; } .featured-side a > *:first-child { padding-right: 10px; }

Related: See More


Questions / Comments: