如何使用CSS在按钮之间水平放置空格？

Rahul 发表于 Dev

拉胡尔

当按钮移至第二行时，它们彼此相连且看起来不佳，我想水平放置按钮之间的空间。

      <div class="container">
    <div class="tim-title">
        <h3>What intrests you?</h3>
    </div>

    <button type="button" class="btn btn-outline-danger btn-round" placement="right"
        ngbPopover="Here will be some very useful information about this popover." popoverTitle="Popover on right">
        Artificial Intelligence
    </button>
    &nbsp;
    <button type="button" class="btn btn-outline-danger btn-round" placement="top"
        ngbPopover="Here will be some very useful information about this popover." popoverTitle="Popover on top">
        Management
    </button>
    &nbsp;
    <button type="button" class="btn btn-outline-danger btn-round" placement="left"
        ngbPopover="Here will be some very useful information about this popover." popoverTitle="Popover on left">
        Data Science
    </button>
    &nbsp;
    <button type="button" class="btn btn-outline-danger btn-round" placement="bottom"
        ngbPopover="Here will be some very useful information about this popover." popoverTitle="Popover on bottom">
        FInance
    </button>
    &nbsp;
    <button type="button" class="btn btn-outline-danger btn-round" placement="right"
    ngbPopover="Here will be some very useful information about this popover." 
    popoverTitle="Popover on right">
    Human Resource
    </button>
    &nbsp;
    

      </div>

webpassion101

每个按钮添加MB-3级（如在以前的评论说），我也想补充MR-3级（或MR-2）代替的 （它只是更好的实践和引导的使用）。

像这样：

<div class="container">
    <div class="tim-title">
        <h3>What intrests you?</h3>
    </div>

    <button type="button" class="btn btn-outline-danger btn-round mb-3 mr-3" placement="right" ngbPopover="Here will be some very useful information about this popover." popoverTitle="Popover on right">
        Artificial Intelligence
    </button>
    <button type="button" class="btn btn-outline-danger btn-round mb-3 mr-3" placement="top" ngbPopover="Here will be some very useful information about this popover." popoverTitle="Popover on top">
        Management
    </button>
    
    ...
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。