Полоса прокрутки видна в полноэкранном режиме

Я сделал приложение для просмотра изображений, которое просто отправляет изображение на телевизор с помощью малины, отображая его на подключенном экране через HDMI. Программным обеспечением для отображения является Chrome, но у меня есть небольшая проблема:

Есть очень маленькая область в 4px, которую я должен обрезать внизу изображения, чтобы не видеть полосу прокрутки.

Пример: Разрешение экрана 1024 x 768

• использование изображения 1024 x 768 в полноэкранном режиме создает вертикальную полосу прокрутки
• уменьшение пикселей y на 4 (1024 x 764) приводит к исчезновению полосы прокрутки, но показывает белую границу под изображением в полноэкранном режиме в Chrome для Linux.

У меня нет ни малейшей фантазии на тему css или html-кода:

let content = document.getElementById("content");
let ImageDiv = document.createElement("IMG");

ImageDiv.src = pic.file

content.appendChild(ImageDiv);

только с очень небольшим количеством css:

body {
    margin: 0;
}

как лучше всего избавиться от границы и полосы прокрутки?

Редактирование:

https://jsfiddle.net/jLv74co6/1/

Минимальный пример. не совсем уверен, что он поможет, так как проблема может быть связана с версией chrome linux.

::-webkit-scrollbar {
    width: 0;
    height: 0;
}
body {
    scrollbar-width: none;
}
img {
    display: block;
}