<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.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 ----------> <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'> <div class="container"> <div class="fb-profile"> <img align="left" class="fb-image-lg" src="http://lorempixel.com/850/280/nightlife/5/" alt="Profile image example"/> <img align="left" class="fb-image-profile thumbnail" src="http://lorempixel.com/180/180/people/9/" alt="Profile image example"/> <div class="fb-profile-text"> <h1>Eli Macy</h1> <p>Girls just wanna go fun.</p> </div> <div id="timelineNav"> <div id="timelineButtons"> <span class="follow"> <button type="button" class="UserActions-editButton edit-button btn" data-scribe-element="profile_edit_button" style="border-color:#cccccc;background-color:#ffffff;margin-left:365px;"> <span class="button-text">Edit profile</span> </button> </div> <ul> <li> <span class="arrowUp"></span><a href="#"><span id="update_count" class="timelineNum">0</span> Updates</a></li> <li> <a href="#"><span class="timelineNum">0</span> Friends</a ></li> <li> <a href="#"><span id="update_count" class="timelineNum">0</span> Photos</a> </li> <li> <a href="#"><span id="update_count" class="timelineNum">0</span> Photos</a> </li> <li> <a href="#"><span id="update_count" class="timelineNum">0</span> Photos</a> </li> <li> <a href="#"><span id="update_count" class="timelineNum">0</span> Photos</a> </li> <li> <a href="#"><span id="update_count" class="timelineNum">0</span> Photos</a> </li> <li> <a href="#"><span id="update_count" class="timelineNum">0</span> Photos</a> </li> <li> <a href="#"><span id="update_count" class="timelineNum">0</span> Photos</a> </li> </ul> </div> </div> </div> <!-- /container -->

/* ========================================================================== Author's custom styles ========================================================================== */ body { font-family: 'Open Sans', sans-serif; } .fb-profile img.fb-image-lg{ z-index: 0; width: 100%; margin-bottom: 10px; } .fb-image-profile { margin: -90px 10px 0px 50px; z-index: 9; width: 20%; } @media (max-width:768px) { .fb-profile-text>h1{ font-weight: 700; font-size:16px; } .fb-image-profile { margin: -45px 10px 0px 25px; z-index: 9; width: 20%; } } #timelineNav { border: 1px solid #ffffff; background-color: #ffffff; min-height: 43px; margin-bottom: 10px; position: ; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } #timelineButtons { position: absolute; margin-left: 681px; margin-top: 5px; text-align: right; width: 168px; } #timelineNav ul { list-style: none; margin-left: 210px; } #timelineNav li { float: left; height: 19px; padding: 12px; font-weight: bold; font-size: 14px; min-width: 82px; text-align: center; }