如何让对话框选择像这样的自定义对话框在右上角取消按钮，像这样？

<div class="dialog-container">
  <!-- 对话框内容 -->
  <div class="dialog-content">
    <!-- 对话框内容 -->
  </div>
  <!-- 关闭按钮 -->
  <button class="close-button">取消</button>
</div>

.dialog-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* 其他样式属性 */
}

.dialog-content {
  /* 对话框内容的样式 */
}

.close-button {
  position: absolute;
  top: 10px;
  right: 10px;
  /* 关闭按钮的样式 */
}

var dialogContainer = document.querySelector('.dialog-container');
var closeButton = document.querySelector('.close-button');

closeButton.addEventListener('click', function() {
  dialogContainer.style.display = 'none';
});