Кнопка закрытие блока

/* Блок сообщения */ 
.alert { 
    padding: 20px; 
    background-color: green; 
    color: white; 
    margin-bottom: 15px; 
} 
 
/* Крестик */ 
.closebtn { 
    margin-left: 15px; 
    color: white; 
    font-weight: bold; 
    float: right; 
    font-size: 26px; 
    line-height: 20px; 
    cursor: pointer; 
    transition: 0.3s; 
} 
 
.closebtn:hover { 
    color: black; 
}

<div class="alert"> 
  <span class="closebtn" onclick="this.parentElement.style.display='none';">&times;</span>  
  Тут Ваше сообщение 
</div>

* { 
  padding: 0; 
  margin: 0; 
  box-sizing: border-box; 
} 
 
body { 
  background-color: #ddd; 
  padding: 16px; 
} 
 
.modal-wrapper { 
  position: fixed; 
  left: 0; 
  top: 0; 
  width: 100vw; 
  height: 100vh; 
  background-color: rgba(0, 0, 0, .2); 
  display: flex; 
} 
 
.modal { 
  width: 40vw; 
  height: 40vh; 
  background-color: white; 
  margin: auto; 
  border-radius: 4px; 
  box-shadow: 0 0 10px rgba(0, 0, 0, .2); 
  position: relative; 
} 
 
.modal label { 
  position: absolute; 
  right: 0; 
  top: 0; 
  font-size: 200%; 
  width: 1em; 
  height: 1em; 
  line-height: 1; 
  text-align: center; 
  cursor: pointer; 
} 
 
.modal label:hover { 
  color: blue; 
} 
 
#openclose, 
.modal-wrapper { 
  display: none; 
} 
 
#openclose:checked~.modal-wrapper { 
  display: flex; 
} 
 
#button { 
  color: blue; 
  text-decoration: underline; 
  cursor: pointer; 
}

<label for="openclose" id="button">Открыть модальное окно</label> 
<input type="checkbox" id="openclose"> 
<div class="modal-wrapper"> 
  <div class="modal"> 
    <label for="openclose">&times;</label> 
  </div> 
</div>