Question

我有一个大问题。我尝试创建一个插槽并从这个插槽创建一个网格。我是这样做的：

我有类Slot.js我只画了一个简单的矩形。现在我在Main类中创建一个网格：

for(let i = 0; i <= ROW_NUM; i++)
{
    for(let j=0; j <= COL_NUM; j++)
    {
        let s = new Slot();
        let gStyle = s.graph.style;
        gStyle.left = j * SLOT_WIDTH + "px";
        gStyle.top = i * SLOT_HEIGHT + "px";
        gStyle.position = "absolute";
        g.appendChild(s.graph);


    }
}

所以我有一些div并添加到这个div我的插槽。现在我想设置这个div到中心的位置。但是如果我在我的style.css文件中设置它，这个div不会设置正确的位置。网格位置始终从左上角开始。如果我设置绝对位置，那么这个div将改变他的位置。

我该如何解决？

Answer 1

只需添加一个类来居中一个绝对div。

HTML：

<div id="parent">
    <div class="centered-div">
    Hi i'm centered
    </div>
</div>

CSS：

#parent { position: relative; }
.centered-div { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%) }

不需要JS

带有CSS位置的Javascript网格

1 个答案: