css - 带有 tailwindCSS 的全宽按钮组

Question

说真的，你如何让 TailwindCSS 按钮组跨越整个宽度？对于简单的按钮，您可以使用btn-block，但是一旦您开始使用按钮组，这将不起作用。

Answer 1

好吧，我正在纠正这个我找到了答案，但仍然继续发布这个，因为我没有在其他地方找到答案......

所以我最终使用了此处记录的顺风 witdh 类

  <div class="btn-group">
    <button class="btn w-1/2 btn-outline btn-primary ">Save</button> 
    <button class="btn w-1/2 btn-outline ">Cancel</button> 
  </div>

所以这个类w-1/2给出了 50% 的宽度，我正在使用这个，因为我的按钮组中只有 2 个按钮，所以你应该根据按钮的数量进行相应的调整。

这种技术的缺点是，如果您想动态添加按钮，它可能会变得复杂。放还是可行的。