Как сделать, чтобы при уменьшении экрана браузера сам фон расстягивался?(смотрите скрины))

Question

Вот мой сайт при полноэкранном режиме: Как только я уменьшаю размер экрана браузера, то происходит "сжатие" фона приложения: и как только я перемещаюсь к правому краю приложения, то происходит такое: Но такое не происходит, если идти не к правому краю, а вниз, то есть с высотой всё в порядке: И вот в чём заключается вопрос: как сделать c шириной также, чтобы было как с высотой, то есть, как сделать так, чтобы фон и все элементы на нём изменяли свой местоположение в зависимости от размеров окна браузера, но при этом, чтобы(как в моём случае) не было "лишнего белого" и чтобы фон и все элементы на нём не "съезжали"?
Мой код:

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Inst-Post Searcher</title>
    <style>
        body {
            background-color: #2a2929;
            background: -moz-linear-gradient(to bottom, #333 20%, #2a2929 90%, #808080);
            background: -webkit-gradient(linear, 0 0, 0 100%, from(#333), to(#808080), color-stop(0.5, #2a2929));
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333', endColorstr='#808080');
            background-repeat: no-repeat;
            height: 968px;

        }
        .new {
            top: 830px;
            font-size: 1.0vw;
            color: darkorange;
            background: none;
            border: none;
        }
    </style>
</head>
<body>
    <div align="center" style="position:relative;">
        <h1 style="color: darkorange">Inst-Post Searcher</h1>
        <hr width="1900" size="2" color="darkorange" />
    </div>
    <form method="post">
        <div style="position: relative; top: 835px; font-size: 1.0vw; color: darkorange; background: none; border: none;">
            <hr width="1900" size="5" color="#000000" />
            <a style="position: relative; top: 10px; left: 820px; text-decoration: none;" class="new" align="centre" href='@Url.Page("/PrivacyPolicy")'>Политика конфиденциальности</a>
            <a style="position: relative; top: 10px; right: 200px; text-decoration: none;" class="new" align="left" href='@Url.Page("/TermsOfUse")'>Условия использования</a>
            <a style="position: relative; top: 10px; left: 1180px; text-decoration: none;" class="new" align="right" href='@Url.Page("/DeveloperContacts")'>Контакты разработчика</a>
        </div>
    </form>
    @RenderBody()
</body>
</html>

БЛОГ НА HUSL

Как сделать, чтобы при уменьшении экрана браузера сам фон расстягивался?(смотрите скрины))

Ответы (0 шт):