Les boutons flottants de la boîte de dialogue continuent de se chevaucher

Question

Bonjour, je suis en train de créer une application Maui Blazor et j'ai une boîte de dialogue pleine page avec un bouton flottant. Lorsque la boîte de dialogue est fermée et renvoyée à la page d'origine, sur la page d'origine il y a un espace mort où se trouve le bouton de boîte de dialogue (sur la boîte de dialogue, je change la visibilité du bouton en fonction d'une condition). Le style que j'ai utilisé pour le bouton flottant :

.center {
    bottom: 5%;
    z-index: 999;
    cursor: pointer;
    margin: 0;
    position: fixed;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

Mise à jour : J'ai modifié le css du bouton flottant, et maintenant il n'y a plus d'espace mort, mais la position n'est pas bonne :

.center {
    bottom: 5%;
    cursor: pointer;
    margin: 0;
    left:50%;
}

Answer 1

Il existe deux façons de définir si un élément est visible.

Une façon consiste à ajouter visibility 设置为 hidden. L'élément HTML sera alors masqué, mais l'espace qu'il occupait sera conservé.

Une autre façon est d'ajouter display 设置为 none. Dans ce cas, l'élément HTML est masqué mais l'espace dans lequel il réside n'est pas conservé.

Vous pouvez donc essayer d'utiliser display并将其值设置为none.