Bootstrap中col-md-4内按钮居中及相对尺寸设置问题

我来帮你逐个搞定这两个Bootstrap相关的布局问题：

1. 让col-md-4容器中的按钮居中 #

你现在用的center-block类在Bootstrap 4及以上版本已经被弃用了，这也是它没起作用的核心原因。推荐用Bootstrap原生的flex布局类来实现居中，既可靠又符合现代布局规范：

解决方案 #

给每个col-md-4添加d-flex justify-content-center类，这样col内部的内容会自动水平居中。如果还需要垂直居中，再加上align-items-center就好（看你的代码结构，应该只需要水平居中）。

修改后的代码示例 #

<div class="row position-relative mt-2">
  <div class="col-md-4 d-flex justify-content-center">
    <div class="align-to-bottom">
      <div class="btn-group-vertical">
        <p>
          <button class="btn btn-info btn-sm btn-block" type="button"> button </button>
        </p>
        <p>
          <button class="btn btn-warning btn-sm btn-block" type="button"> button </button>
        </p>
      </div>
    </div>
  </div>
  <div class="col-md-4 d-flex justify-content-center">
    <div class="btn-group-vertical">
      <p>
        <button class="btn btn-info btn-sm btn-block" type="button"> button </button>
      </p>
      <p>
        <button class="btn btn-info btn-sm btn-block" type="button"> button </button>
      </p>
      <p>
        <button class="btn btn-warning btn-sm btn-block" type="button"> button </button>
      </p>
    </div>
  </div>
  <div class="col-md-4 d-flex justify-content-center">
    <p>
      <button class="btn btn-success btn-sm btn-block" type="button"> button </button>
    </p>
  </div>
</div>

2. 解决w-100、h-85类无效问题，设置按钮相对尺寸 #

关于w-100无效的排查方向 #

w-100是Bootstrap 4+的内置类（作用是width: 100%），如果没生效，大概率是这几个原因：

• 按钮的父容器没有明确宽度，导致100%没有参考基准；
• 有更高优先级的CSS规则（比如内联样式、ID选择器）覆盖了w-100的样式，你可以打开浏览器开发者工具检查样式优先级；
• 你用的是Bootstrap 3或更早版本，这些版本没有w-*系列工具类。

关于h-85无效的原因 #

Bootstrap默认只提供h-25、h-50、h-75、h-100这几个预设高度类，h-85不是内置类，直接用肯定不会生效。你可以自己定义这个类：

.h-85 {
  height: 85% !important;
}

按钮相对尺寸的灵活设置方案 #

除了上面的类，还有这些实用方式：

• 基于父容器的百分比：直接给按钮加style="width: 90%; height: 70%;"，前提是父容器有确定的宽高；
• 视口单位：用vw（视口宽度）、vh（视口高度）设置，比如style="width: 80vw; height: 12vh;"，按钮尺寸会随浏览器窗口大小自动调整；
• 响应式类：用Bootstrap的响应式尺寸类，比如w-md-75（中等屏幕及以上宽度为75%），适配不同设备；
• 自定义工具类：像上面的h-85一样，根据需求定义自己的尺寸类，方便后续复用。

内容的提问来源于stack exchange，提问作者profiler