0

I am using angularJS to create web pages for the application. I have multiple tabs with content. I want to make tabs fixed without scrolling and only the content should scroll when the data is more to view. I went through many examples online and tried but nothing had worked for me as the content in the tab is having multiple div's and tables.

  <div ng-controller="TabsParentController" class="tabs-wrapper">
    <tabset class="full-size">
        <tab ng-repeat="workspace in workspaces"
             heading="{{workspace.name}}"
             active=workspace.active>
           <div class="tab-content" ng-include="workspace.content"></div>

         </tab>
    </tabset>
</div>

CSS code:

  .tabs-wrapper {
    position: relative;
    }
  .full-size {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }

I have tried using css code, but it didn't work. Please suggest how to make tabs fixed without scrolling and only the content inside the tabs should be scrolled.

joan
  • 131
  • 2
  • 4
  • 12

0 Answers0