确定父级大小时CSS忽略一个元素 [英] CSS Ignore one element when determining parent size

问题描述

基本上，我该如何实现:

Basically, how can I achieve this:

<div id="outerDiv">
    <div class="ignoreWidth" style="width: 20px;">20px</div>
    <div style="width: 4px;">4px</div>
    <div style="width: 8px;">8px</div>
</div>
<!-- outerDiv.style.width == 8px -->

无需对外部div的宽度进行硬编码.

Without hard-coding the width for the outer div.

position:absolute 用于解决宽度问题，但随后所有其他元素都在其下方移动.有什么方法可以避免这种情况而无需填充?

The position: absolute worked for fixing the width problem, but then all the other elements are moved under it. Is there any way to avoid that without padding?

推荐答案

为externalDiv relative 和 position 设置css position 属性类 ignoreWidth absolute 并设置为0、0

make the css position attribute for outerDiv relative and the position for the class ignoreWidth absolute and set to 0, 0

这应将第一个内部div放置在外部div的左上方，并使用其自身的height和width属性

this should position the first inner div in the top left of the outer div and use it's own height and width properties

在此页面的CSS文件中:

in your css file for this page:

#outerDiv {
  position:relative;
}
.ignoreWidth {
  position:absolute;
  top: 0;
  left: 0;
}

这篇关于确定父级大小时CSS忽略一个元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！