Css 如何使元素的宽度和高度更灵活？

我有一个元素需要包装。我想知道是否有比设置高度和宽度更有效的方法来创建这个包装，因为我必须多次更改它才能得到我想要的

.search{
背景色：黑色；
颜色：白色；
文本对齐：居中；
高度：20px；
宽度：20px；
}

您可以去掉宽度并使用

.search{
    background-color: black;
    color:white;
    text-align: center;
    height: 20px; 
    margin: auto;
}

---

你有没有一个例子，说明在不同的时间你必须设置它的大小？您可以使用百分比作为宽度，最大和最小宽度以及百分比、flex、css变量等。有很多选项，但我们无法从提供的信息中判断哪一个是最好的。您可以与我们分享JSFIDLE吗？解释你想要实现的目标。我建议给父元素指定一个特定的高度&设置

。搜索
的高度到某个百分比高度和宽度相等，您是否尝试制作一个可以变大或变小的正方形？@GammaGames对不起。这是我的沙盒链接。我想让“搜索”按钮与img中的一样，但我不得不多次设置高度和宽度不，看起来根本不固定