我怎样才能使这个背景适合这个 flex 显示器的文本

Question

我可以对 "btn" 适合文本的绿色容器（背景）做些什么？

section {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

a {
  text-align: center;
  text-decoration: none;
  margin: 20px;
  padding: 20px;
  background-color: rgb(88, 194, 120);
}

<section id="sec1">
  <a href="#" class="btn">btn</a>
</section>

Answer 1

将 flex 更改为 inline-flex。

section {
  display: inline-flex;
  flex-direction: column;
  justify-content: space-around;
}

a {
  text-align: center;
  text-decoration: none;
  margin: 20px;
  padding: 20px;
  background-color: rgb(88, 194, 120);
}

<section id="sec1">
  <a href="#" class="btn">btn</a>
</section>

我怎样才能使这个背景适合这个 flex 显示器的文本

How can i fit this background in the text in this flex display

html

css

background