Question

我试图创建一个项目列表，当单击菜单但我遇到CSS问题时可以访问这些项目。我设法删除了子弹点，但它在边界和div的边缘之间留下了巨大的空隙。我想知道是否有一种简单的方法可以将表集中在div中，这类似于text-align或类似的东西。我更喜欢需要自动触摸的东西，而不仅仅是猜测像素的宽度。

这是我迄今为止创建的CSS：

.submenudiv{
    display:inline-block;
    /*height:170px;
    width:120px;*/
    background-color: grey;
    /*border: 2px black solid;*/
    margin: auto;
    /*margin-top: 50px;*/
    padding: 5px;

    text-align: center;
}
.submenudiv: hover{
    background-color:blue;
}
.list{
    list-style-type: none;
    /*margin-left: -40px;
    margin-top:3px;*/
    border: 2px solid black;
    padding: 5px;
    text-align: left;

}
.list:hover{
    background-color:blue;
    color:white;
}

这个JS代码是：

var list = function () {
    var creatDiv = document.createElement("div");
    creatDiv.id = "submenudiv";
    creatDiv.className = "submenudiv";

    var creatul = document.createElement("ul");
    for(index = 0; index < 5; ++index){
        li = document.createElement("li");
        li.className = "list";
        li.innerHTML = "Submenu" + index;
        creatul.appendChild(li);
    }

    creatDiv.appendChild(creatul);
    document.body.appendChild(creatDiv);
};



creatbtndiv.onclick = function () {
    var alert = confirm("yes master");
    list();
};

只需点击＆＃34;点击我＆＃34;，确认要继续的命令并显示一个表格。

感谢帮助。

Answer 1

删除差距

ul {
    margin:0;
    padding:0;
}

中心表

.divContainer{
    text-align:center;
}
table {
    margin:0 auto;
}

我怎样才能纠正这个让它看起来更好？

1 个答案: