如何使用css和angular-ui使侧边栏水平折叠？

Question

我想使用collapse angular-ui指令来使用侧边栏的幻灯片功能，幻灯片正在工作，但diagrams按钮保持在同一位置。当侧边栏可见时，如何将diagrams按钮移动到cols右侧，当侧边栏滑入时，如何向左移动？如果我添加margin-left diagrams按钮将移动到cols的右侧，但是当侧边栏不可见时它不会返回到左侧。

HTML

<div class="col-md-2">
  <div class="horizontal-collapse" uib-collapse="isCollapsed">
    <div class="col-md-2" style="position: static">
      <treecontrol class="tree-classic"
                   tree-model="dataForTheTree"
                   options="treeOptions"
                   on-selection="showSelected(node)"
                   selected-node="node1" id="treecontrol">

      <span  ng-click="importXMLFunction(node)">
        {{node.text}}
      </span>
      </treecontrol>
    </div>
  </div>
  <span type="button" class="btn btn-default" ng-click="isCollapsed = !isCollapsed" id="treelist">diagrams</span>
</div>

CSS

#treelist{
  width:100px;
  transform: rotate(90deg);
  transform-origin: 0 100%;
  position:relative;
  top:70px;
  left:0px;

}

JS

$scope.isNavCollapsed = true;
$scope.isCollapsed = false;
$scope.isCollapsedHorizontal = false;