Блок div чуть увеличивается или чуть отклоняется левее(сложно заметить на глаз) при изменении padding у полей таблицы

цсска:

#menu {
    width: 220px;
    padding: 1px;
    float: left;
    margin-top: 20px;
    border-top-width: 3px;
    border-top-style: solid;
    border-top-color: #fff;
    margin-left: 5px;
    box-shadow: 2px 2px 8px rgba(0,0,0,.1);
    border-radius: 10px;
}

    #menu h3 {
        color: #000;
        margin: 5px;
    }

    #menu ul {
        list-style-type: none;
        margin: 0px;
        padding: 0px;
        width: 220px;
    }

        #menu ul li:hover {
            background-color: #F0F0F0;
        }

    #menu li {
        display: block;
        padding: 5px;
        color: #616161;
        text-decoration: none;
    }

    #menu a {
        display: block;
        font-size: 12px;
        color: #616161;
        margin-left: 15px;
        text-decoration: none;
    }

.title {
    font-size: 14px;
    cursor: pointer;
    margin-top: 3px;
    padding: 8px;
}

    .title:hover {
        background: #F0F0F0;
    }

.expand {
    cursor: pointer;
}

/*
*************************************************************************************************************************************************
*/

/*
    Content бар справа
*/
.maincontent {
    list-style-type: none;
    width: 620px;
    float: right;
    margin-top: 20px;
    height: auto;
    box-shadow: 2px 2px 8px rgba(0,0,0,.1);
    border-radius: 10px;
    padding-left: 20px;
    padding-bottom: 20px;
    padding-right: 10px;
}

/*
*************************************************************************************************************************************************
*/

/*
    Для статей 
*/
.article {
}

    .article ul {
        display: block;
    }

li {
    display: block;
}

.article a {
}

.url {
}

.tag {
    text-align: center;
    background-color: #EFEEF7;
    margin-top: 20px;
    width: 60px;
    padding: 8px;
    box-shadow: 1px 1px 8px rgba(0,0,0,.1);
}

.gray {
    background-color: #f2f2f2;
    padding: 4px;
}

table {
    border-spacing: 0 4px;
    margin: 0;
}

td, th {
    margin: 0;
    border: 1px solid #000;
    padding: 6px;
    font-size: 12px;
}






/*
*************************************************************************************************************************************************
*/

/*
    Блоки, враперы, шрифты.
*/
.wrapper {
    margin: 0 auto;
    height: 800px;
    width: 898px;
}

.left_block {
    float: left;
    width: 220px;
}

.right_block {
    float: right;
    width: 678px;
}

body {
    font-family: Verdana, Roboto Condensed, sans-serif;
    font-size: 14px;
}

cshtml:

<div class="wrapper">
    <div class="left_block">
        <div class="box" id="menu">
            <div class="title">
                Список №1
                <span class="expand">+</span>
            </div>
            <ul class="dropdown">
                <li class="test"><a asp-controller="Article" asp-action="GetArticle" asp-route-id=1>1</a></li>
                <li class="test"><a asp-controller="Article" asp-action="GetArticle" asp-route-id=2>2</a></li>
                <li class="test"><a asp-controller="Article" asp-action="GetArticle" asp-route-id=3>3</a></li>
                <li class="test"><a asp-controller="Article" asp-action="GetArticle" asp-route-id=4>4</a></li>
                <li class="test"><a asp-controller="Article" asp-action="GetArticle" asp-route-id=5>5</a></li>
            </ul>
        </div>
    </div>
    <div class="right_block">

        @{
            if (Model != null)
            {
                <div class="maincontent">
                    <div class="tag">
                        @Html.Raw(Model.Tag)
                    </div>
                    <div class="article">
                        @Html.Raw(Model.Header)
                        @Html.Raw(Model.Content)
                    </div>
                </div>
                <div class="maincontent">
                    <div class="article">
                        @Html.Raw(Model.Examle)
                        <div class="text-center"><input type="submit" value="Попробовать Пример" onclick="location.href='@Url.Action("GetArticle"+Model.Id, "api")'" /></div>
                    </div>
                </div>
            }
        }
    </div>
</div>

На обычной html вроде все окей. Оно даже отображается по-разному почему-то. Скрины как выглядит в асп и как выглядит в браузере обычная html.

ASP:

html

Цсс код 1 в 1 одинаковый. Прям только что скопировал и вставил. html тоже. Единственное что там конечно нету razor команд. Я там просто текст вставил. Еще в асп импортирован бутстрап, но я отключал его, все также. Собственно меня устраивает как все выглядит в асп. А что не устраивает я уже умею подтягивать. Вопрос в том, почему блин дергает блок при увеличении padding. Я прочитал способ и добавлял box-sizing: border-box; в maincontent, но это тоже ничего не изменило.

P.S. в _Layout классы я удалил. То есть RenderBody() не находится ни в одном классе.