Градиент в полноэкранном модальном бутстрапе

Question

У меня есть веб-страница html, и она использует https://github.com/basilebong/bootstrap4-fullscreen-modal, и я использую линейный градиент, чтобы разделить деление на две части и покрасить их в два разных цвета, как в этом случае:

Страница написана с использованием начальной загрузки 4.

Это работает очень хорошо, когда я не использую модальный, но когда я использую модальный, чтобы показать это, у меня есть эта проблема (только на Chrome, у меня есть версия Chrome 70.0.3538.77 (Официальная сборка) (64 бит) в macOs):

Но когда я использую зум, он исчезает.

В других браузерах это работает очень хорошо.

Это код градиента, который я использую:

#ha {
    background: -moz-linear-gradient(left, #ffffff 0%, #ffffff 50%, #d5d5d5 50%, #d5d5d5 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #ffffff), color-stop(50%, #ffffff), color-stop(50%, #d5d5d5), color-stop(100%, #d5d5d5)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #ffffff 0%, #ffffff 50%, #d5d5d5 50%, #d5d5d5 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #ffffff 0%, #ffffff 50%, #f6f6f6 50%, #d5d5d5 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #ffffff 0%, #ffffff 50%, #f6f6f6 50%, #d5d5d5 100%); /* IE10+ */
    background: linear-gradient(to right, #ffffff 0%, #ffffff 50%, #d5d5d5 50%, #d5d5d5 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9c9e9f', endColorstr='#f6f6f6', GradientType=1); /* IE6-9 */
}

Я не могу разделить col-sm-2 на две части, потому что мне нужно поместить в центр изображение, как в этом случае:

У вас есть идея, чтобы убрать эту белую линию?

Это мой код:

<div class="container">
    <div class="row">
        <div class="col-sm-5">
        </div>
        <div class="col-sm-2" id="ha">
            <div class="text-center" style=" min-height: 100%">
                <img src="Image.png" style="max-width:80%; max-height:80%;" align="center">
            </div>
        </div>
        <div class="col-sm-5" style="background-color: #d5d5d5">
        </div>


    </div>
</div>

Я должен использовать Bootstrap, чтобы быть уверенным, что страница может отображаться на всех устройствах (ПК, планшет и т. Д.) Без каких-либо странных эффектов.