jquery - 忽略父级的最佳 div 宽度

标签 jquery html css popover

我正在使用 jQuery、HTML 和 CSS3 构建弹出窗口。
你可以在这里查看:

http://themelandia.com/lib/pages/templates/popover.html

目前我将弹出窗口放在触发器之后。
触发器和弹出框用 div.popover-wrapper 包裹。

<div class="popover-wrapper">
    <a class="popover-trigger" href="#">The Trigger</a>
    <div class="popover">
        This is the popover!
    </div>
</div>

我的问题是 popover get 被 popover-wrapper 的父级合并了。 虽然如果我添加像

这样的长字符串,布局没有问题

AReallyLongLineWithoutASpaceWhichGetsDisplayedCorrectly

以下字符串在每个新单词后换行。

A really long line With space which doesnt get displayed correctly

你也可以在上面的链接中看到这个。
第一个 popover 工作正常,而第二个则不是,因为它被包裹在宽度较小的 div 中。


div.popover-wrapper {
    position: relative;

    div.popover {
        position: absolute;
        z-index: 200;
        width: auto;
    }
}

非常感谢!

最佳答案

我想最简单的方法是使用 white-space: nowrap<div class="popvover"> .

关于jquery - 忽略父级的最佳 div 宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14558355/

相关文章:

javascript - 使用 JS/Jquery 渲染 .txt 文件中的内容时在单词之间添加空格

javascript - 使用 Javascript 和 Jquery 更改样式表中的背景图像

javascript - 如何在底部的 div 内添加横幅?

html - 当我选择下拉菜单时,重叠在 IE9 和 IE8 中的箭头上选择了蓝色 bg

Jquery,在导航顶部扩展搜索表单

css - 如何使用 CSS 减慢旋转动画?

javascript - jquery 相当于 javascript 间隔函数

java - 从 Servlet 获取复选框值

JQuery toggle() 表现非线性

javascript - 禁用选择标签,并使用 angularjs 和 ng-repeat 从另一个选择标签中选择选项