'a problem with showing PDF in window in IE

I'm having a problem with PDF showing in front of the properties panel in IE but not in Chrome.

tried using z-index but had no success

using angular 7.13

I know IE support has stopped and no one likes it but it will take time for the company to stop using it.

edit: added some of the code, I can't add more because of company protocols. I don't think it's a codding problem, it works on all other browsers.

```html for the file viewer
<div *ngSwitchCase="actionsBarType == eActionsBar.Viewer ? eActionsBar.Viewer : actionsBarType == 
eActionsBar.ViewerFullScreen ? eActionsBar.ViewerFullScreen :
                            actionsBarType == 
eActionsBar.ArchivesViewer ? eActionsBar.ArchivesViewer :
                        actionsBarType == eActionsBar.ArchivesViewerFullScreen ? eActionsBar.ArchivesViewerFullScreen : '' ">
  <mat-expansion-panel #panel [hideToggle]="true">
    <mat-expansion-panel-header style="max-height: 38px !important;">
      <mat-panel-title>
        <div *ngTemplateOutlet="actions"></div>
      </mat-panel-title>

    </mat-expansion-panel-header>

    <div *ngIf="item != null">
      <viewer-properties [viewerData]="item [viewerPropertiesTemplate] = "viewerPropertiesTemplate">
      </viewer-properties>
    </div>
  </mat-expansion-panel>
</div>

```html for the properties panel
        <div [ngSwitch]="viewerPropertiesTemplate">
            <div *ngSwitchCase="'properties'">
                <div *ngIf="viewerData.ecmContentType == eECM_ContentType.FILE" class="viewer-properties rtl">
                <div class="row">
                    <div class="col-6">
                        <span class="title">שם קובץ: </span>
                        <span class="text">{{viewerData.name | removeSuffix }}</span>
                    </div>
                    <div class="col-6">
                        <span class="title">מזהה קובץ: </span>
                        <span class="text">{{viewerData.id}}</span>
                    </div>
                </div>
                <div class="row">
                    <div class="col-6">
                        <span class="title">זמן העלאת הקובץ למאגר: </span>
                        <span class="text">{{viewerData.creationDate | date : "d/M/yy HH:mm"}}</span>
                    </div>
                    <div class="col-6">
                        <span class="title">הקובץ נוצר ע"י: </span>
                        <span class="text">{{viewerData.creatorName.value}}</span>
                    </div>
                </div>
                <div class="row">
                    <div class="col-6">
                        <span class="title">סוג קובץ: </span>
                        <span class="text">{{viewerData.fileTypeStr }}</span>
                    </div>
                </div>
                <div class="row">
                    <actions-bar [item]="viewerData" [actionsBarType]="eActionsBar.ViewerProperties"></actions-bar>
                </div>
            </div>
        </div>
    </div>

```css 
.viewer-properties{
position: relative;
height: auto;
z-index: 1000;
padding: 1%;
pointer-events: all;
cursor: auto;
/*cursor: pointer;*/
}
```
`

Solution 1:^[1]

solved it, by using angular material Platform cdk to differentiate Trident based browsers, and downloading files while in IE instead of opening them in the page.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Michael Roizman

'a problem with showing PDF in window in IE

Solution 1:[1]

Sources

Related Questions

Solution 1:^[1]