如何去掉弹出菜单中的白色 space？

Question

我正在尝试去除弹出窗口中的白色 margin/gutter，以便黄色按钮跨越弹出窗口的整个宽度。我怎样才能做到这一点？

代码：

  <button type="button" data-html="true" class="btn btn-secondary btn-sm btn mr-1 "
      data-trigger="focus" data-container="body" data-toggle="popover" data-placement="bottom"
      data-content= '<div style="display: none">
<ul class="list-group custom-popover ml-0 px-0">
  <li class="list-group-item"><a href="profile.php">Profile</a></li>
  <li class="list-group-item"><a href="includes/logout.php">Logout</a></li>
</ul>
</div>'>
<?php echo 'popover menu'?></button>

Answer 1

要更改弹出窗口的样式，您只需使用 CSS。您的问题的解决方案是将其添加到您的自定义 css 文件中。

.popover-body{
  padding: 0px;
}

如果您想了解当 boostrap 创建弹出窗口时发挥作用的所有样式，您可以在您从 boostrap 下载的文件夹中名为 _popover.scss 的文件中查看它们。

如何去掉弹出菜单中的白色 space？

how to get rid of white space in a popover menu?

layout

popover

bootstrap-4