JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<body>
  <script type="text/javascript">
    var app = angular.module('MyApp', [])
    app.controller('MyController', function($scope) {
      //This will hide the DIV by default.
      $scope.IsVisible = true;
      $scope.ShowHide = function() {
        //If DIV is visible it will be hidden and vice versa.
        $scope.IsVisible = !$scope.IsVisible;
      }
    });

  </script>
  <div ng-app="MyApp" ng-controller="MyController">
   
    <br />
    <br />
    <div class="meni col-lg-2 col-md-2 col-sm-12 col-xs-12">
     <ul>
      <li>home</li>
      <li>home</li>
      <li>home</li>
      <li>home</li>
      <li>home</li>
     </ul>
    </div >
    <div class="container-fluid col-lg-10 col-md-10 col-sm-12 col-xs-12">
    
    <div class="test col-lg-4 col-md-4 col-sm-12 col-xs-12" ng-class="{'divOpen': IsVisible}">
     <div ng-if="!IsVisible">
        ID<br>
        50<br>
        51<br>
        52<br>
     </div>
     <div ng-if="IsVisible">
      MAPA
     </div>
    </div>
    <div class="col-lg-8 col-md-8 col-sm-12 col-xs-12">
     <div class="testtest">
     <input type="button" ng-if="!IsVisible" value="Back" ng-click="ShowHide()" />
       <table class="table" ng-if="IsVisible">
        <tr>
        <td>ID</td>
        <td>NAME</td>
        <td>LOCATION</td>
        <td>No</td>
        </tr>
        <tr>
        <td>50</td>
        <td>NAME</td>
        <td>LOCATION</td>
        <td> <input type="button" value="SHOW/HIDE" ng-click="ShowHide()" /></td>
        </tr>
        <tr>
        <td>51</td>
        <td>NAME</td>
        <td>LOCATION</td>
        <td> <input type="button" value="SHOW/HIDE" ng-click="ShowHide()" /></td>
        </tr>
        <tr>
       ...

CSS

.test {
  background: red;
  width: 50px;
  height: 350px;
    -webkit-transition: width 2s;-moz-transition: width 2s ease-in-out;-ms-transition: width 2s ease-in-out;
-o-transition: width 2s ease-in-out;transition: width 2s;
}


.divOpen{
  width: 100px;
}
.testtest{
  background: green;
  height: 350px;
  width: auto;
}
.meni {
  background-color: grey;
  height: 350px;
}