縦横幅がinline-block要素のように可変なものを中央配置させたい。CSS

👋こんにちは。僕は、watnowでUX/UIデザインをしています。
縦横幅がinline-block要素のように可変なものを中央配置させたいと悩んでいたらしれっとメンバーが教えてくれたのでそれを紹介します。
#結果とコード
モーダルで使用することが多いと思うのでそのスタイルで書いています。

hoge.css

.wrapper {
 display: flex;
 position: fixed;
 justify-content: center;
 align-items: center;
 background-color: rgba(26, 32, 35, 0.8);
 margin: auto;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
}
.contents {
 min-width: 360px;
 max-width: 80%;
 height: auto;
 min-height: 360px;
 background-color: #fff;
 padding: 24px;
 display: inline-block;
}

#おわりに
json to csvというJSONをCSVに変換するツールをメンバーと作ってみたので是非使ってみてください。