css - 两个固定宽度的 div 在父 div 中需要等距间距

Question

我在另一个父 div 中有两个 div（其固定宽度为 150 像素），其宽度根据浏览器的宽度而变化。

我想将两个子 div 定位在父级中，因此两个 div 之间的边距将等于父 div 和子 div 边缘之间的边距。

红色箭头始终具有相等长度的示例：

Answer 1

编辑：你可以做我最初建议的，但现在添加

#leftwrapper, #rightwrapper { text-align: center; }
#childdiv1, #childdiv2 { display: inline-block; }

内联块，而不是块，你不需要边距然后为子 div ...

如果这不起作用，可能不会，如果不使用表格，可能很难得到你想要发生的事情

您必须创建两个新的 div 包装器

所以你有了

#parentdiv { display: block; width: 100%; }
#leftwrapper { display: inline-block; width: 50%; }
#rightwrapper { display: inline-block; width: 50%; }
#childdiv1 { display: block; margin: 0 auto; }
#childdiv2 { display: block; margin: 0 auto; }

html就像

<div id="parentdiv">
    <div id="leftwrapper">
        <div id="childdiv1">your stuff</div>
    </div>
    <div id="rightwrapper">
        <div id="childdiv2">your stuff</div>
    </div>
</div>