如何在 bootstrap 4 中设置绝对位置时的 mr-0

Question

对于我在 bootstrap 中使用的吐司，我想使用 classmr-0 将吐司推到右侧。但这不起作用：

<div class="toast hide position-absolute mr-0"  data-autohide="false">
    <div class="toast-header">
         <strong class="mr-auto text-primary">Share Link</strong>         
         <button type="button" class="ml-2 mb-1 close" data-dismiss="toast">&times;</button>
    </div>
    <div class="toast-body">
    <?php echo $share_link; ?>
    </div>
</div>

当我使用它时：style="right: 0px;" 它有效：

<div class="toast hide position-absolute" style="right: 0px;" data-autohide="false">
...

谁能告诉我为什么 mr-0 在这种情况下不起作用？

Answer 1

mr-0是一个margin-right: 0px，对position: absolute没有直接影响。您可以在 MDN docs.

上阅读有关绝对位置的更多信息

Answer 2

使用仓位relative使用保证金。 margin-bottom、margin-left、margin-right在绝对定位下不起作用，

如何在 bootstrap 4 中设置绝对位置时的 mr-0

how to set mr-0 in bootstrap 4 when position absolute

html

css

margin

twitter-bootstrap