CSS3中的盒子模型在實現布局時，可以使用display: flex;或是display: grid;等方式，但一些老舊的布局需求仍需要使用傳統的盒子模型和定位方式。在這種情況下，如何實現DIV左右居中呢？

常見的實現方式是使用position: absolute;和left: 50%;的方式，但這樣會使元素的左側與父元素基線對齊，而不是居中。此時可以使用transform完成居中的實現。

.center {
position: absolute;
left: 50%;
transform: translateX(-50%);
}

上述代碼中，transform: translateX(-50%);的作用是向左移動元素寬度的50%。這樣，元素即可在水平方向上居中。

需要注意的是，此方式只能在元素已知寬度的情況下使用，否則元素可能會出現寬度不定的問題。另外，使用此方式時還需要將父元素的position設置為relative。