html让两个按钮同一行居中,javascript – Three.js – 将两个按钮居中放入父div的子div中...

至于控件右边的间距,你的#gui元素的右边距为15px,所以你可以通过添加margin-right：0来纠正它.到#gui的CSS规则：

#gui {position: absolute; top: 0; right: 0; margin-right:0;}

至于对齐元素是否居中,我在这里将其分解：

理论

为了使像div这样的中心,使用CSS的方法是让子元素使用margin-right和margin-left都设置为auto,而父元素需要足够宽以填充你想要的区域容器要在里面居中.

解

容器的宽度(在这种情况下是#buttons)只有它内部的按钮宽,所以没有足够的宽度使按钮能够居中,如果你只是这样做：

#button {

margin-left: auto;

margin-right: auto;

}

因此,宽度#buttons容器必须增加,以便它可以像你需要的那样宽,在这种情况下,与#gui元素一样宽,但这样做仍然不会让按钮成为居中,因为它们有两个,所以你需要一个包装元素,在里面创建空间让按钮居中.在DOM中看起来像这样：

Start Animation

Reset

然后需要将#buttons-wrapper设置为#gui的宽度(按钮应居中的空间的目标宽度),并且#buttons需要设置为等于子的总和的宽度容器#startButtonId和#resetButtonId,然后margin-right和margin-left最终可以应用于#buttons,它将按预期工作.

要动态设置宽度,您必须使用JavaScript并测量所需容器的宽度：

document.getEleme