Ширина блока div относительно размера страницы

Здравствуйте!

Подскажите пожалуйста, на странице в несколько рядов, размещено по 100 картинок в каждом ряду, примыкающих друг к другу. Картинки размером 10х10.

При уменьшении размера экрана часть картинкок раньше перескакивали с своего ряда на нижний, подстраиваясь под размер экрана.

Мне нужно было, чтобы при уменьшении размера экрана, количество картинок в одном ряду не уменьшалось, а оставалось строго 100 картинок в каждом ряду.

Эту проблему я решил, добавлением в стили CSS, блока:

#boxShadowtext {

width: 100%;

max-width: 1030px;

min-width: 1030px;

margin: 1em auto;

padding: 1em;

border-radius: 10px;

background: rgb(255,245,237) radial-gradient(circle at 50% , rgba(255,255,255,.65), rgba(255,255,255,.35));

box-shadow:

inset rgba(0,0,0,.6) 0 -3px 8px,

inset rgba(252,255,255,.7) 0 3px 8px,

rgba(0,0,0,.8) 0 3px 8px -3px;

}

И с помощью <div id="boxShadowtext"> упаковал все картинки на странице в этот блок с уже строго заданными размерами по ширине 1030px;

Теперь количество картинок в каждом ряду по 100 зафиксировано блоком boxShadowtext, но при уменьшении размера экрана блок boxShadowtext вместе с картинками в нем вылазит за пределы экрана, страница эта: http://kartinki.rabotavinternet.net или вот скрин выходящего блока за пределы сайта при уменьшении экрана: http://ibb.co/mvyxi7

Вопрос: Как можно сделать, чтобы блок boxShadowtext с картинками расположенными в нём, автоматически уменьшался в размерах, под разные размеры экрана, но чтобы количество картинок при этом в ряду не уменьшалось и оставалось равное 100 шт? То есть, чтобы сам блок с содержимым просто уменьшался в размерах при уменьшении экрана.

Заранее спасибо за ответ.