4
votes

l'en-tête de la grille sera masqué dans la boîte de dialogue pendant la réduction du navigateur

Accédez à cet article de la boîte de dialogue

Voir cette image ci-dessous lorsque j'ouvre la boîte de dialogue

 entrez la description de l'image ici

Mais le problème est que l'en-tête de la grille sera masqué lors de la réduction du navigateur

 entrez la description de l'image ici

J'utilise la boîte de dialogue partout dans mon application. Mon projet va vivre ce week-end. Mais je devrais résoudre ça avant d'aller vivre. Pourriez-vous s'il vous plaît quelqu'un réparer cela?


0 commentaires

5 Réponses :


0
votes

Essayez ce css

.ui-dynamicdialog { 
    height: 100%;
    overflow: auto;
    z-index: 100000;
    transform: translateX(-50%) translateY(-50%);
    opacity: 1;
    margin: 30px 0;
}

Ajustez le CSS selon vos besoins. Calculez le haut et définissez-le ici


2 commentaires

Qu'entendez-vous par ui-dynamicdialog ? où dois-je ajouter?


Inspectez un échantillon de primeng sur son site Web. Il s'agit d'une boîte de dialogue primeng ajoutée à la classe par défaut



0
votes

Essayez ceci

body .ui-dialog { z-index: 9999;}


0 commentaires

3
votes

Vous devez remplacer .ui-dialog {z-index: 1001;} inline z-index en utilisant ! important comme indiqué ci-dessous :

.ui-dialog {
 z-index: 9999!important;
}

Ceci est dû au fait que l'id # layout-topbar z-index est plus grand que ui-dialog , vous devez donc remplacer ui-dialog z-index en utilisant ! important . j'espère que cela vous aidera.


0 commentaires

0
votes

Utilisez la propriété baseZIndex pour DynamicDialog et définissez sa valeur au-delà de la valeur # layout-topbar qui est 9998

const ref = this.dialogService.open(CarsListDemo, {
    header: 'Choose a Car',
    width: '70%',
    baseZIndex: 9999 //Base zIndex value to use in layering
});


0 commentaires

0
votes

Le redimensionnement de la fenêtre du navigateur ne donnera pas des résultats optimaux pour une vue réactive. J'ai vérifié votre page et votre css. Tout a l'air bien et il n'y a pas de problème.

Mais, lorsque vous redimensionnez le navigateur, la fenêtre contextuelle apparaît comme si l'en-tête de la grille était masqué sous l'en-tête de la page. La raison derrière cela est que la fenêtre contextuelle de la grille est en position fixe, elle calculera donc la hauteur totale de la fenêtre du navigateur et apparaîtra au centre de celle-ci.

Essayez de l'afficher en utilisant Activer / désactiver la barre d'outils de l'appareil (Ctrl + Maj + M) et votre fenêtre contextuelle regarde exactement au centre verticalement et horizontalement. Image ci-dessous pour votre référence.

 entrez la description de l'image ici


0 commentaires