LinkTree using Bootstrap

HTML

<div class="tree">
  <div class="profile-pic"><svg class="bd-placeholder-img rounded-circle" width="140" height="140" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: 140x140"><title>Placeholder</title><rect width="100%" height="100%" fill="#777"/><text x="50%" y="50%" fill="#777" dy=".3em">140x140</text></svg></div>
  <div class="username">@brandonhimpfen</div>
  <div class="links">
    <a href="" class="btn btn-outline-primary btn-lg btn-block">Visit Our Website</a>
    <a href="" class="btn btn-outline-success btn-lg btn-block">Shop Now and Save 40%</a>
    <a href="" class="btn btn-outline-dark btn-lg btn-block">Learn How-to Build a Website using WordPress</a>
    <a href="" class="btn btn-outline-primary btn-lg btn-block">Check Out Our Weekly Newsletter</a>
    <a href="" class="btn btn-outline-primary btn-lg btn-block">Subscribe to Our YouTube Channel!</a>
  </div>
  <div class="footer">
    Copyright &copy; Brandon Himpfen - All Rights Reserved.
  </div>
</div>

CSS

.tree {
  margin: 0 auto;
  text-align: center;
}
.tree .username {
  text-transform: uppercase;
  font-weight: 600;
  margin: 2em;
}
.tree .links a {
  margin: 0.75em auto;
}
.tree .footer {
  margin: 2rem;
}
Show Comments