Как выровнять мой DocumentFragment по центру?

Question

Я создал набор кнопок 9x9, но они находятся в левом верхнем углу, и я хотел бы выровнять их все по центру. Я попытался использовать <div> для выравнивания всего этого, но это не работает, и на странице ничего не появляется.

    var docFrag = document.createDocumentFragment();
    for (var i=0; i < 9 ; i++){ 
        var row = document.createElement("tr") 
        for (var j=0; j < 9 ; j++){ 
                var elem = document.createElement('input');
                elem.className = 'gumb';
                elem.type = 'button';
                ...something...
                docFrag.appendChild(elem); 
            } 
        document.body.appendChild(docFrag); 
        document.body.appendChild(row); 
    } 

Answer 1

Используйте это js вместо:

// use div to add class to center the elements
var item = document.createElement('div');
item.className = "container";

    for (var i=0; i < 9 ; i++){
        var docFrag = document.createDocumentFragment();
        var row = document.createElement("br") 
        for (var j=0; j < 9 ; j++){ 
                var elem = document.createElement('input');
                elem.className = 'gumb';
                elem.type = 'button';
                docFrag.appendChild(elem); 
            } 
        item.appendChild(docFrag); 
        item.appendChild(row); 
    } 
document.body.appendChild(item)

// make the `container` div full width and center the items in it
.container {
     width: 100%;
     text-align:center;
}