弹出弹出窗口时不保存文本

Question

我已经使用纯HTML中的boostrap pop over类制作了自定义pop over /语音框。

问题：当我更改输出框对齐方式时，弹出框似乎并没有保留动作文本保存记录。

我尝试过更改位置，但是没有用。

 <div class="popover fade bottom in" role="tooltip" style="top: 17.5938px; left: 0; display: inline-table;width: 36%;padding: 0px;text-align: center;border-radius: 0px;padding-bottom: 5px">
            <div class="arrow" style="left: 50%;"></div>
            <h3 class="popover-title" style="display: none;"></h3>
            <div class="popover-content">
                <p>Are you sure you wish to save the records?</p>
                <div style="display:inline-flex">
                    <button class="btn btn-sm btn-primary btn-save btn-square"  style="background-color:#0076C9;border: none;padding: 5px 25px 5px 25px;margin-left: 0px">Yes</button>
                    <button class="btn btn-sm btn-default btn-save btn-square"  style="color:#0076C9;padding: 5px 15px 5px 15px;margin-left: 8px">Cancel</button>
                </div>
            </div>
        </div>

仅供参考：JsFiddle

Answer 1

我看不到模态与文本之间的关系。最简单的方法（据我所知）是创建一个包装，其中文本和模式将是同级。然后将position: relative设置为包装器，将position: absolute设置为模态。另外，您还应将top更改为bottom进行模态更改。在这里，我做了一个非常简单的示例：https://jsbin.com/yegufisumi/1/edit?html,css,output