JSFiddle - React, Tailwind, and code Playground

HTML

<div id="message" style="display: block; ">
    <span>This is test message.</span> <a href="#" id="close-notify">X</a>
</div>
Hello World
Hello World
Hello World

CSS

#message {   
    display: none;   
    background-color: #F4A83D;    
    border-bottom: 1px solid #D6800C;   
    padding: 7px 0; 
    font-weight: bold;   
    text-align: center;   
    color: #735005;   
    position: fixed;   
    left: 0px;   
    top: 0px;   
    width: 100%;  
}
body {
    padding-top: 50px;
}

JavaScript

$("#message").slideDown('slow');
$('#close-notify').click(function() {
    $("#message").fadeOut('fast');
});