Two pivot table in same page conflicts each other

[NAYAN MIYATRA]

I'm using pivot table in my Angular Project, one of my page has two pivot table on same page but they both overlap each other.

First Pivot Table: 

 <div style="box-shadow: 0px 0px 9px 0px #dddbdb;border-radius: 5px;">

          <div class="panel panel-inverse">

              <div class="panel-body p-0">

                  <app-pivotview #pivotview id='PivotView' [dataSource]="dataSource" [dataSourceSettings]="dataSourceSettings"

                  showFieldList='true' width='100%' height='300' allowConditionalFormatting='true' [gridSettings]='gridSettings'></app-pivotview>

              </div>

          </div>

      </div>

Second Pivot Table: 

<div class="col-md-12" style="margin-top: 10px;">

        <div style="box-shadow: 0px 0px 9px 0px #dddbdb;border-radius: 5px;">

            <div class="panel panel-inverse">

                <div class="panel-body p-0">

                    <app-pivotview #pivotview id='PivotView1' [dataSource]="dataSource1" [dataSourceSettings]="dataSourceSettings1"

                    showFieldList='true' width='100%' height='300' allowConditionalFormatting='true' [gridSettings]='gridSettings'></app-pivotview>

                </div>

            </div>

        </div>

    </div>

The view I get:

 

They both conflicts each other as you can see on above Image 

[Manikandan Murugesan]

Hi Nayan Miyatra, 

 

We have checked the reported problem and we are unable to reproduce it at our end. Please refer the following sample. 

 

Sample: https://stackblitz.com/edit/angular-xvrhzj?file=app.component.html 

 

If still the problem exists, kindly reproduce the problem in the above provided sample and revert to us (or) send your sample that replicating the problem. This would be helpful for us to investigate the reported problem at our end and provide the solution at the earliest. 

 

Regards, 

Manikandan