position d'une image pour fermer un lien

Bonjour à tous, J’ai un petit souci (je précise, je débute) : j’ai en bas à gauche d’un site que j’essaie de faire un chat("tchat") (cf capture) https://postimg.cc/tZfWWZ1Z J’aimerais placer un "bouton rouge" en haut à droite. Ce serait un lien, pour que si le visiteur n’a pas javascript, il puisse quand même fermer cette fenêtre par php (en gros, si je clique dessus je renvoie la même page avec une variable à "fermé" et il n’apparait que le bouton rouge, tout en bas à gauche). L’image de chat encadrée est aussi un lien qui envoie sur le "tchat".

Pour l’instant, j’ai fait un truc qui marche pas du tout :

<a href="exoChat.php" class="chat bordure">
<a id="chatButton">
</a>
</a>

a {
    display: block;
    text-decoration: none;
}
.chat {
    position: fixed;
    bottom: 0;
    left: 0;
    background-image: url('../images/chat.png');
    background-size: contain;
    width: 250px;
    height: 250px;
    margin: 2%;
}
#chatButton {
    background-image: url('../images/closer.png');
    background-size: contain;
    position: top right;
    width: 30px;
    height: 30px;
}

Merci pour vos conseils

Tu t’y prends de la mauvaise façon, tu ne le fais pas dans le bon sens. Par défaut, tu la désactives puis au chargement de la page tu l’affiches via du js.

je sais pas si je comprends bien ta solution, mais si je la comprends ça ne résout pas mon problème (enfin ça résout le problème de la personne qui n’a pas JS en fait c’est vrai…). Mais du coup une personne qui a JS, qui l’ouvre et qui a envie de la fermer, il faut du coup avoir le bouton rouge en haut à gauche, qui ne fasse pas partie du lien global qui envoie sur le chat. Du coup il faudra toujours ce foutu bouton rouge :s

C’est bon en fait j’ai réussi Je sais pas si c’est très "bonne pratique" par contre :

<?php if($_SESSION['chat'] == 'off') { ?>
<a href="chatIco.php" class="chatButton" id="chatButtonOff"></a>
<?php } else { ?>
<a href="exoChat.php" class="chat bordure"></a>
<a href="chatDown.php" class="chatButton" id="chatButtonSmall"></a>
<?php } ?>

du coup avec $_SESSION['chat'] je modifie les liens et leur id, puis le CSS modifie leur position. Du coup que js marche ou pas j’ai le petit carré qui peut s’ouvrir/se fermer

[edit : doublé sur mon propre thread par Leeroy Jenkins ;( merci de ton aide edit2 : merci 2 fois d’ailleurs Leeroy Jenkins, pour le CSS j’avais tout mis en fixed mais avec ta solution c’est bien plus propre ]

avec plaisir