Pages

Active class to current page link

To highlight the current page add an active or another class name to the link when the linked page is opened using java script.



  <script>
$(".navbar-nav a").filter(function(){
    return this.href == location.href.replace(/#.*/, "");
}).addClass("active");
  </script>

bootstrap 4 get remaining height of parent div

bootstrap 4 get remaining height of parent div



       <div class="row h-100 flex-column">
        <div class="row">
          <div>
            <div>ROWccccccccccc 1</div>
          </div>
        </div>
        <div class="row justify-content-center align-items-center bg-blue flex-grow-1">
          <div class="text-white">ROWcccccccccccccc 2</div>
        </div>
      </div>


<div class="container-fluid h-100">
  <div class="row justify-content-center h-100">
    <div class="col-4 bg-red">
      <div class="h-100 d-flex flex-column">
        <div class="row justify-content-center bg-purple">
          <div class="text-white">
            <div style="height:200px">ROW 1</div>
          </div>
        </div>
        <div class="row justify-content-center bg-blue flex-grow-1">
          <div class="text-white">ROW 2</div>
        </div>
      </div>
    </div>
    <div class="col-8 bg-gray">grgrgrg</div>
  </div>
</div>

Link - https://codepen.io/anon/pen/RyQvmW?editors=1100

Search This Blog