html - 位置 : absolute and automatic width trough content

标签 html css

我在容器中创建了一个小工具提示。所以有两个 div 都带有 position: absolute;。它们必须是绝对位置,否则它们会弄乱整个设计。

.container_1 {
     position: absolute;
     top: 20px;
     left: 20px;
}

.container_2 {
     position: absolute;
}

<div class="container_1"><div class="container_2">Full Name-Name</div></div>

我在第一个容器中也有一个 CSS 三 Angular 形,所以有两个容器。

在工具提示中显示了用户的全名。但现在我遇到了 div 没有内容那么宽的问题。所以我通过用   替换空格来修复它,但现在破折号也有同样的问题。但是用 替换破折号并不能解决问题。有人知道解决方案吗?

最佳答案

CSS:

.container_1 {
    position: absolute;
    top: 20px;
    left: 20px;
}

.container_2 {
    position: absolute;
    width: 95px;
    overflow: hidden;
    white-space: nowrap;
}

http://jsfiddle.net/yG5eF/

编辑:抱歉,第一次看错了。

关于html - 位置 : absolute and automatic width trough content,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11787112/

相关文章:

javascript - 如何溢出自动聚焦最后一个元素

javascript - 我如何在 Highchart 中使列和 y 轴之间有 1px 的空间?

html - 单独的复选框图像替换

css - HTML5 将图像放在屏幕上我想要的位置

javascript - 将 PHP 变量检索到 Bootstrap Modal

c# - 单击按钮后 ASP.NET 页面元素消失

javascript - 如何创建在弹出窗口下使用的覆盖层

css - CSS中DIV宽度 float 问题

html - Css 替代 js 解决方案,html 以错误的顺序使用 float

javascript - 确定子元素相对于其父元素的索引的最简单方法?