HTML/CSS - chatbot Online Editor and JavaScript Compiler

html

<!DOCTYPE html>
<html>
    <head>
        <title>Page Title</title>
    </head>
    <body>
   <div id="hat">
   <p id="som"align="center"> <span><b>Notice</b></span></p> <p><b>
   Hello Everyone ,this is a normal chat bot but php file linking is not happening here,I tried but it won't work.Please tell me in comment section on how to link it in a better way.</b><br/></p></div>
    
    <button class="open-button" onclick="openForm()">Chat</button>
        <div class="chat-popup" id="myform">
            <form action="https://www.dropbox.com/s/72fjnbqx0trs05i/Php%20data%20storer.php?dl=1" method="post" class="form-container">
            <h3>Pop Up Chat Window</h3>
            <label for="msg"><b>Message</b></label>
            <textarea placeholder="Type  message..." name="msg" required></textarea>
            <button type="submit" class="btn">Send</button>
            <button type="button" class="btn cancel"onclick="closeForm()">Close</button>
            </form>
        </div>
    </body>
</html>
<!--https://www.dropbox.com/s/72fjnbqx0trs05i/Php%20data%20storer.php.docx?dl=0-->
<!--https://www.dropbox.com/s/72fjnbqx0trs05i/Php%20data%20storer.php.docx?dl=1-->
<!--https://www.dropbox.com/s/72fjnbqx0trs05i/Php%20data%20storer.php?dl=1-->

css

body {
    
    font-family:Arial,Helvetica,sans-serif;
    background-image:url("https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSTXo7DoLR2Wv_2Ol87D3MNJw3_VtO27Zmtig&usqp=CAU");
}
*{
    box-sizing:border-box ;
}
.open-button{
    background-color: #555;
    color: white;
    padding:16px 20px;
    border:none;
    cursor:pointer;
    opacity:0.8;
    position:fixed;
    bottom:23px;
    right:45px;
    width:280px;
}
.chat-popup{
    background-color: pink;
    position:fixed;
    bottom:0;
    right:45px;
    border:3px solid  #f1f1f1;
    z-index:9;
}

BROWSER

Console