绝对不考虑父元素的边界定位元素答案

【问题标题】：Position elements absolutely irrespective of borders of the parent element绝对不考虑父元素的边界定位元素
【发布时间】：2014-04-16 01:32:39
【问题描述】：

默认情况下，如果您尝试将元素绝对定位在父容器的左上角，它将根据边框宽度（请参阅小提琴：http://jsfiddle.net/t52Pp/1/）：

<div>
    <i>element</i>
</div>

div {
    position: relative;
    border: 20px solid red;
    height: 14px;
}
div > i {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 14px;
}

如何在不考虑边框宽度的情况下执行相同操作而不必指示负值（例如http://jsfiddle.net/u75s7/1/）：

div > i {
    position: absolute;
    top: -20px;
    left: -20px;
    font-size: 14px;
}

【问题讨论】：

标签： css position absolute

【解决方案1】：

您最好的选择可能是在带边框的 div 周围添加另一个 div。然后给它一个相对位置的样式，并从带边框的 div 中删除位置样式。

这应该可以解决您的问题。

【讨论】：