Question

以下是我的问题：http://jsfiddle.net/875190we/

        <div style = "display:inline-block">
        <span>a</span>
        <span style = "position:relative;top:-1px; font-size:13px">x</span> 3
    </div>

我想说＆＃34; ax3＆＃34; （因为它不包含在绝对元素中）。

我使用绝对值将它定位在灰色元素的右侧和外侧。我基本上希望这个元素生活在gray元素的右边（它本身就是一个更大的文档结构）。但第二个我将绝对定位元素的内联块INSIDE放置，因此它会停止适合它的孩子。

Answer 1

您必须设置宽度，将initial替换为相对大小40px或calc(100%)。

＆＃13;

<body>
    <div style="width:200px;background:grey;position:relative;">hi
        <div style="position:absolute; left:100%; top:0; overflow: visible; width: calc(100%);">
            <div style="display:inline-block"><span>a</span><span style="position:relative;top:-1px; font-size:13px">x</span> 3</div>
        </div>
    </div>
</body>

＆＃13;

（或者您可以使用float: left;代替position: absolute;）

见：

How to force position absolute with 100% width to fit into parent div with padding?

绝对定位时，内联块不会调整大小以适合其子项

1 个答案: