我正在创建一个包含四个按钮的引导网格。按钮应该居中，我希望它们每个都有相同的宽度（理想情况下是全列）。但是，按钮似乎只使用其内容的宽度，如下图所示:

我尝试用width: ;设置display: block，但似乎没有帮助。我的col似乎根本没有宽度？你知道我做错了什么吗？

.container { width: ; } .row { background: #f8f9fa; margin-top: 20px; display: flex; justify-content: space-evenly; } .col { border: solid 1px #6c757d; background: #f5a142; padding: 10px; } .btn { width: ; display: block; } <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.css" rel="stylesheet"/> <div class="container"> <div class="row"> <div class="col-med-6"> <button class="btn btn-primary">Button</button> </div> <div class="col-med-6"> <button class="btn btn-primary">Button</button> </div> </div> <div class="row"> <div class="col-med-6"> <button class="btn btn-primary">Longer Button</button> </div> <div class="col-med-6"> <button class="btn btn-primary">Button</button> </div> </div> </div>

（如果有用的话，这里还有一个jsfiddle链接。）

顺晟科技：