Html CSS 绝对位置，其中 div 的左上角位于父级的右上角

CSS absolute position where top left of div is at the top right of the parent

提问by Ashwin

I want to absolute position a div such that the top left corner of the div is attached to top right corner of the parent div (relative positioned).

我想绝对定位一个 div，使 div 的左上角连接到父 div 的右上角（相对定位）。

Do you have any solutions how to do that ?

你有什么解决办法吗？

Here is a fiddleto start

这是一个开始的小提琴

回答by madeye

I think you want something like this

我想你想要这样的东西

http://jsfiddle.net/kdcmq/

http://jsfiddle.net/kdcmq/

<div id = "parent">
     <div id = "child"></div>
</div>


#parent {
    position: relative;
    width: 500px;
    height: 500px;
    background: red;
    display: block; /* fix for opera and ff */
}

#child {
    position: absolute;
    width: 100px;
    height: 100px;
    background: blue;
    top: 0;
    left: 100%; /* this line of code will sort things out for you :) */
}

回答by silentw

Simple as this?

就这么简单？

http://jsfiddle.net/ZeSF8/2/

http://jsfiddle.net/ZeSF8/2/

CSS:

CSS：

div {border:1px solid #000}
.p {
    position:relative;
    width:100px; /*width will be unknown*/
    height:80px;
    background:#999;
}

.c {
    position:absolute;
    width:40px;
    height:30px;
    background:red;
    top:0;
    left:100%;
}

? HTML:

? HTML：

<div class="p">
    <div class="c"></div>
</div>?