2014-05-14 94 views
-1

我試圖創建一個可以訪問的菜單單擊時可以訪問的項目列表,但即時通訊與CSS有問題。我設法刪除了子彈點,但它留下了邊界和div邊緣之間的巨大差距。我想知道是否有一種集中在div中的表格的簡單方法,可以像文本對齊或類似工作。我更喜歡需要自動觸摸的東西,而不是僅僅猜測像素的寬度。我該如何糾正這一點,使其看起來更好?

這是我創建至今的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(); 
}; 

只需點擊「點擊我」,確認命令繼續和應該出現一個表格。

欣賞幫助。

+1

小提琴就好了。 – Idris

+0

你的HTML在哪裏? @ user3619972 – Brendan

回答

0

刪除差距

ul { 
    margin:0; 
    padding:0; 
} 

中心表

.divContainer{ 
    text-align:center; 
} 
table { 
    margin:0 auto; 
} 
相關問題