//Скриване/показване на празните клетки
document.getElementById('pokupkiHideEmptyCells').onclick = function () {
    var strArray = [],
        styleTag = document.getElementById('pokupkiStyle'),
        newWrapperWidth = document.getElementById('main-wrapper').offsetWidth,
        widthArr = [],
        headerWidth = 0;

    //Проверка дали вече не са скрити колоните
    if (this.innerHTML == 'Покажи празните колони') {
        styleTag.innerHTML = '';
        this.innerHTML = 'Скрии празните колони'
        return;
    }

    this.innerHTML = 'Покажи празните колони';
    for (var a = 0; a < purchFooter.length; a++) {
        if (purchFooter[a] == '0.00') {
            newWrapperWidth -= table.children[0].children[a + 9].offsetWidth;
            styleTag.innerHTML += '#main-wrapper .c' + (a + 10) + '{ width:0px; display:none; }';
        }
    }

    for (var z = 0; z < table.children[0].children.length; z++) {
        widthArr.push(table.children[0].children[z].offsetWidth);
        headerWidth += widthArr[z];
        strArray.push('body #main-wrapper .table-row .c' + (z + 1) + ', body #main-wrapper .table-row .table-row .c' + (z + 1) + '{width: ' + ((table.children[0].children[z].offsetWidth / newWrapperWidth) * 100).toFixed(4) + '%;}');
        if (z == 5) {
            strArray.push('body #main-wrapper .table-row .c1-c6,body #main-wrapper #footer .table-row .c1-c6  { width: ' + ((headerWidth / newWrapperWidth) * 100).toFixed(4) + '%;}');
            strArray.push('body #main-wrapper .table-row .c3c4c5 {width: ' + (((headerWidth - (widthArr[z] + widthArr[0] + widthArr[1])) / newWrapperWidth) * 100).toFixed(4) + '%;}')
            headerWidth = 0;
        }
        if (z == table.children[0].children.length - 1) {
            strArray.push('body #main-wrapper #nameHeader > .table-cell:nth-child(2), body #main-wrapper #footer > .table-row:last-child > .table-cell:last-child { width: ' + ((headerWidth / newWrapperWidth) * 100).toFixed(4) + '%;}');
            strArray.push('body #main-wrapper #footer > .table-row .c8c9 {width: '+ (((widthArr[7] + widthArr[8]) / newWrapperWidth) * 100).toFixed(4) +'%;}')
        }
    }
    strArray.push('body #main-wrapper { width: ' + newWrapperWidth + 'px;} @media print { #main-wrapper > * { font-size: 10px;}}');
    styleTag.innerHTML += strArray.join('');
}

<div id="main-wrapper">
            <div id="nameHeader" class="table-row">
                <div class="table-cell c1-c6">
                    <div>ДНЕВНИК НА ПОКУПКИТЕ</div>
                    <div>ИН по ЗДДС:</div><div id="InZDDS">&nbsp;</div>
                    <div>Данъчен период:</div><div id="DanPer">&nbsp;</div>
                </div>
                <div class="table-cell"><button id="pokupkiHideEmptyCells" class="pokupkiBtns">Скрии празните колони</button></div>
            </div>
            <div id="tableHeader" class="table-row">
                <div class="table-cell c1">N по ред</div>
                <div class="table-cell c2">Клон</div>
                <div class="table-cell c3c4c5">
                    <div class="table-cell">Документ</div>
                    <div class="table-cell c3">Вид</div>
                    <div class="table-cell c4">Номер</div>
                    <div class="table-cell c5">Дата</div>
                </div>
                <div class="table-cell c6">Идентиф. номер на контр. доставчик</div>
                <div class="table-cell c7">Име на контрагента (доставчик)</div>
                <div class="table-cell c8">Вид на стоката услугата</div>
                <div class="table-cell c9">Доставка по чл. 163а от ЗДДС</div>
                <div class="table-cell c10">ДО и данък на получ.дост. ВОП, чл.82,ал2-5 ЗДДС и внос без право на дан.кред. или без данък</div>
                <div class="table-cell c11">ДО на пол.дост ВОП,чл.82 ал.2-5 ЗДДС,внос, ДО на получ. дост. използвани за дост. по чл.69 ал 2 ЗДДС с право на ПДК</div>
                <div class="table-cell c12">ДДС с право на пълен данъчен кредит</div>
                <div class="table-cell c13">ДО на пол.дост ВОП,чл.82 ал.2-5 ЗДДС, внос, ДО на получ. дост. използвани за дост.по чл.69 ал.2 ЗДДС с право на ЧДК</div>
                <div class="table-cell c14">ДДС с право на частичен данъчен кредит</div>
                <div class="table-cell c15">Годишна корекция по чл. 73, ал8 ЗДДС</div>
                <div class="table-cell c16">ДО при придобиване на стоки от тристр.операция</div>
            </div>
            <div id="tableHeadersFooter" class="table-row">
                <div class="table-cell c1-c6">&nbsp;</div>
                <div class="table-cell c7">&nbsp;</div>
                <div class="table-cell c8">&nbsp;</div>
                <div class="table-cell c9">ОБЩО:</div>
                <div class="table-cell c10">&nbsp;</div>
                <div class="table-cell c11">&nbsp;</div>
                <div class="table-cell c12">&nbsp;</div>
                <div class="table-cell c13">&nbsp;</div>
                <div class="table-cell c14">&nbsp;</div>
                <div class="table-cell c15">&nbsp;</div>
                <div class="table-cell c16">&nbsp;</div>
            </div>
            <div id="table" class="table-row"></div>
            <div id="footer" class="table-row">
                <div class="table-row">
                    <div class="table-cell c1-c6">&nbsp;</div>
                    <div class="table-cell c7">&nbsp;</div>
                    <div class="table-cell c8c9">Общо без вид 11,12,13:</div>
                    <div class="table-cell c10">&nbsp;</div>
                    <div class="table-cell c11">&nbsp;</div>
                    <div class="table-cell c12">&nbsp;</div>
                    <div class="table-cell c13">&nbsp;</div>
                    <div class="table-cell c14">&nbsp;</div>
                    <div class="table-cell c15">&nbsp;</div>
                    <div class="table-cell c16">&nbsp;</div>
                </div>
                <div class="table-row" id="footerFullSum">
                    <div class="table-cell c1-c6">&nbsp;</div>
                    <div class="table-cell c7">&nbsp;</div>
                    <div class="table-cell c8c9">Общо:</div>
                    <div class="table-cell c10">&nbsp;</div>
                    <div class="table-cell c11">&nbsp;</div>
                    <div class="table-cell c12">&nbsp;</div>
                    <div class="table-cell c13">&nbsp;</div>
                    <div class="table-cell c14">&nbsp;</div>
                    <div class="table-cell c15">&nbsp;</div>
                    <div class="table-cell c16">&nbsp;</div>
                </div>
                <div class="table-row">
                    <div class="table-cell c1-c6">
                        <span>Длъжност:</span>
                        <span>Управител:</span>
                    </div>
                    <div class="table-cell">
                        <span>Подпис и печат:</span>
                    </div>
                </div>
            </div>
        </div>

#main-wrapper {
    width: 1750px;
    border-left: 1px solid #999999;
    font-size: 11px;
}

.table-row {
    width: 100%;
}

.table-cell {
    border-right: 1px solid #999999;
}

#nameHeader, #nameHeader > .table-cell {
    height: 60px;
}

    #nameHeader > .table-cell:first-child, #nameHeader > .table-cell:nth-child(3) {
        width: 20%;
    }

    #nameHeader > .table-cell:nth-child(2) {
        width: 80%;
    }

    #nameHeader > .table-cell:first-child > div:first-child {
        font-size: 20px;
        font-weight: bold;
        padding-left: 10px;
    }

    #nameHeader > .table-cell:first-child > div:nth-child(2), #nameHeader > .table-cell:first-child > div:nth-child(4) {
        width: 51%;
        padding-left: 20%;
    }

    #nameHeader > .table-cell, #tableHeader > .table-cell, #tableHeadersFooter > .table-cell {
        border-bottom: 1px solid #999999;
    }

    #nameHeader > .table-cell {
        border-top: 1px solid #999999;
    }

#tableHeader > .table-cell {
    height: 50px;
}

#tableHeader > .table-cell {
    text-align: center;
}

    #tableHeader > .table-cell:first-child, #table > .table-row > .table-cell:first-child {
        width: 1.2%;
    }

    #tableHeader > .table-cell:nth-child(2), #table > .table-row > .table-cell:nth-child(2) {
        width: 1.8%;
    }

    #tableHeader > .table-cell:nth-child(3) {
        width: 11%;
    }

    #tableHeader > .table-cell:nth-child(4), #table > .table-row > .table-cell:nth-child(6) {
        width: 6%;
    }

    #tableHeader > .table-cell:nth-child(3) > .table-cell:first-child {
        height: 36px;
    }

    #tableHeader > .table-cell:nth-child(3) > .table-cell:nth-child(2), #tableHeader > .table-cell:nth-child(3) > .table-cell:nth-child(3), #tableHeader > .table-cell:nth-child(3) > .table-cell:nth-child(4) {
        height: 14px;
    }

    #tableHeader > .table-cell:nth-child(3) > .table-cell:first-child {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #999999;
    }

    #tableHeader > .table-cell:nth-child(3) > .table-cell:nth-child(2) {
        width: 12%;
    }

    #tableHeader > .table-cell:nth-child(3) > .table-cell:nth-child(3) {
        width: 50%;
    }

    #tableHeader > .table-cell:nth-child(3) > .table-cell:nth-child(4) {
        width: 38%;
        border-right: none;
    }

    #tableHeader > .table-cell:nth-child(5), #table > .table-row > .table-cell:nth-child(7), #footer .table-row > .table-cell:nth-child(2), #tableHeadersFooter > .table-cell:nth-child(2) {
        width: 10%;
    }

    #tableHeader > .table-cell:nth-child(6), #tableHeader > .table-cell:nth-child(7), #table > .table-row > .table-cell:nth-child(8), #table > .table-row > .table-cell:nth-child(9),
    #tableHeadersFooter > .table-cell:nth-child(3),#tableHeadersFooter > .table-cell:nth-child(4)  {
        width: 4%;
    }

    #tableHeader > .table-cell:nth-child(8), #tableHeadersFooter > .table-cell:nth-child(5), #footer .table-row > .table-cell:nth-child(4), #table > .table-row > .table-cell:nth-child(10) {
        width: 10%;
    }

    #tableHeader > .table-cell:nth-child(9), #tableHeadersFooter > .table-cell:nth-child(6), #footer .table-row > .table-cell:nth-child(5), #table > .table-row > .table-cell:nth-child(11) {
        width: 14%;
    }

    #tableHeader > .table-cell:nth-child(10), #tableHeadersFooter > .table-cell:nth-child(7), #footer .table-row > .table-cell:nth-child(6), #table > .table-row > .table-cell:nth-child(12) {
        width: 5%;
    }

    #tableHeader > .table-cell:nth-child(11), #tableHeadersFooter > .table-cell:nth-child(8), #footer .table-row > .table-cell:nth-child(7), #table > .table-row > .table-cell:nth-child(13) {
        width: 13%;
    }

    #tableHeader > .table-cell:nth-child(12), #tableHeadersFooter > .table-cell:nth-child(9), #footer .table-row > .table-cell:nth-child(8), #table > .table-row > .table-cell:nth-child(14) {
        width: 5%;
    }

    #tableHeader > .table-cell:nth-child(13), #tableHeadersFooter > .table-cell:nth-child(10), #footer .table-row > .table-cell:nth-child(9), #table > .table-row > .table-cell:nth-child(15) {
        width: 8%;
    }

    #tableHeader > .table-cell:nth-child(14), #tableHeadersFooter > .table-cell:nth-child(11), #footer .table-row > .table-cell:nth-child(10), #table > .table-row > .table-cell:nth-child(16) {
        width: 7%;
    }

#tableHeadersFooter > .table-cell:first-child {
    width: 20%;
}

#tableHeadersFooter > .table-cell {
    background: #d8d8ff;
}

#tableHeadersFooter > .table-cell:first-child, #tableHeadersFooter > .table-cell:nth-child(2), #tableHeadersFooter > .table-cell:nth-child(3) {
    border-right:none;
}

#tableHeader > .table-cell:nth-child(5) {
    line-height: 50px;
}

#footer > .table-row:first-child > .table-cell, #footer .table-row:nth-child(2) > .table-cell {
    border-bottom: 1px solid #999999;
    height: 15px;
    background: #d8d8ff;
}

#footer .table-row > .table-cell:first-child {
    border-right: none;
    width: 20%;
}

#footer .table-row > .table-cell:first-child, #footer .table-row > .table-cell:nth-child(2) {
    background-color: transparent;
    border-bottom: none;
}

#footer .table-row > .table-cell:nth-child(3) {
    width: 8%;
    text-align: right;
    padding-right: 5px;
}

#footer > .table-row:nth-child(3) > .table-cell {
    height: 50px;
    line-height: 50px;
}

    #footer > .table-row:nth-child(3) > .table-cell:first-child, #footer > .table-row:nth-child(3) > .table-cell:nth-child(3) {
        width: 20%;
        border-right: none;
    }

    #footer > .table-row:nth-child(3) > .table-cell:nth-child(2) {
        width: 80%;
        text-align: left;
    }

        #footer > .table-row:nth-child(3) > .table-cell:nth-child(2) span {
            padding-left: 175px;
        }

    #footer > .table-row:nth-child(3) > .table-cell:first-child span:first-child {
        padding-left: 10px;
    }

    #footer > .table-row:nth-child(3) > .table-cell:first-child span:nth-child(2) {
        padding-left: 50%;
    }

#footer > .table-row:last-child > .table-cell {
    border-bottom: 1px solid #999999;
}

#table > .table-row > .table-cell:nth-child(3) {
    width: 1.32%;
}

#table > .table-row > .table-cell:nth-child(4) {
    width: 5.5%;
}

#table > .table-row > .table-cell:nth-child(5) {
    width: 4.18%;
}

#table > .table-row > .table-cell, #tableHeadersFooter > .table-cell {
    border-bottom: 1px solid #999999;
}

#table > .table-row > .table-cell {
    overflow: hidden;
    height: 15px;
}


@media print {
    #main-wrapper {
        width: 100%;
    }

    nav, #pokupkiHideEmptyCells {
        display: none;
    }

    #main-wrapper > * {
        font-size: 7px;
    }

    #main-wrapper #nameHeader > .table-row:first-child > .table-cell:first-child {
        font-size: 16.5px;
    }
}