简体   繁体   English

位置:绝对和自动宽度槽含量

[英]position: absolute and automatic width trough content

I created a little Tooltip thats in a Container. 我在容器中创建了一个小的工具提示。 So there a two divs both with position: absolute; 因此,有两个div都具有以下position: absolute; . They have to be position absolute or otherwise they will mess up the whole design. 它们必须处于绝对位置,否则会弄乱整个设计。

.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>

I also have a CSS Triangle in the first container so that's why there are two containers. 我在第一个容器中还有一个CSS Triangle,所以这就是为什么有两个容器的原因。

In the Tooltip there is shown the Full Name of a user. 工具提示中显示了用户的全名。 But now I have the problem that the div isn't as wide as the content. 但是现在我有一个问题,就是div不如内容宽。 So I fixed it through replacing space with &nbsp; 因此,我通过用&nbsp;替换了空格来解决此问题 but now there is the same problem with dash's. 但是现在破折号有同样的问题。 But the problem doesn't get fixed by replacing the dash with &ndash; 但是,用&ndash;代替破折号并不能解决问题&ndash; . Anybody knows a solution? 有人知道解决方案吗?

CSS: CSS:

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

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

http://jsfiddle.net/yG5eF/ http://jsfiddle.net/yG5eF/

Edit : Sorry, totally misread it the first time. 编辑 :抱歉,第一次完全误读了它。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM