Прокрутка MOTD

ThePhoenix · 11 Ноя 2017

Приветствую, мне нужно чтобы в мотд картинка была растянута на всю и не было прокрутки, использую такой код:

Код:



<html>

<head>

<title>Motd server</title>

<style type="text/css">

<!--

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

background-color: #000000;

}

-->

</style>

</head>

<body>

<img src="*** ссылка ***" width="100%" height="100%"

border="0" align="center">

</body>

</html>

Но прокрутка есть и не могу никак убрать, самое странное, что растягивая картинку к примеру на 120%, в самом верху остаётся чернота как и сейчас:

xZenon · 11 Ноя 2017

ThePhoenix, Не знаю мб что то не правильно тут есть, но этот работает как нужно:)

Код:

<body bgcolor='#000000'>

<img src="http://ссылка" width="100%" height="100%"

border="0" align="center">

Subb98 · 11 Ноя 2017

HTML:

<html>

<head>

    <title>Motd server</title>

    <style>

        body {

            margin: 0;

            overflow: hidden;

        }

        img {

            width: 100%;

            height: 100%;

        }

    </style>

</head>

<body>

<img src="https://static.pexels.com/photos/36764/marguerite-daisy-beautiful-beauty.jpg">

</body>

</html>

ThePhoenix · 11 Ноя 2017

Subb98, скролла нет, но рофл норм с серой полоской вместо чёрной :D

Subb98 · 11 Ноя 2017

ThePhoenix, это не полоска, это background. Сейчас ещё вариант скину.

11 Ноя 2017

HTML:

<html>

<head>

    <title>Motd server</title>

    <style>

        html, body {

            margin: 0;

            padding: 0;

            overflow: hidden;

        }

        img {

            width: 100%;

            height: 100%;

        }

    </style>

</head>

<body>

<img src="https://static.pexels.com/photos/36764/marguerite-daisy-beautiful-beauty.jpg">

</body>

</html>

Так попробуйте.

ThePhoenix · 11 Ноя 2017

Subb98, ничего не изменилось по сравнению с вашим первым вариантом :)

Subb98 · 11 Ноя 2017

ThePhoenix, ещё вариант:

HTML:

<html>

<head>

    <title>Motd server</title>

    <style>

        html, body {

            margin: 0;

            padding: 0;

            overflow: hidden;

        }

        div.background {

            width: 100%;

            height: 100%;

        }

    </style>

</head>

<body>

    <div class="background">

        <img src="https://static.pexels.com/photos/36764/marguerite-daisy-beautiful-beauty.jpg" width="100%" height="100%">

    </div>

</body>

</html>

ThePhoenix · 11 Ноя 2017

Subb98, появился скролл

Subb98 · 11 Ноя 2017

ThePhoenix, добавьте к свойствам html, body overflow: hidden;
П.с.: обновил пост выше.

ThePhoenix · 12 Ноя 2017

Subb98, вернулись к варианту без скролла, но с полоской серой =)
В принципе меня она устраивает, т.к вписывается в дизайн :D

Rasul · 12 Ноя 2017

ThePhoenix, Лучший вариант, должен помочь)

HTML:

У body задать style="margin: 0, padding: 0"

А картинке

<img src="*** ссылка ***" width="100%" height="100%"  style="position fixed">

ThePhoenix · 12 Ноя 2017

Rasul, всё тоже самое, без скролла, но с полоской))
что должно было измениться? проверить на разном расширении экрана?

SergeyShorokhov · 12 Ноя 2017

ThePhoenix, ты это не в кс пробовал проверить?

ThePhoenix · 12 Ноя 2017

wopox1337, конечно в кс, я меняю код на фтп, потом захожу на сервер и обновляю табом мотд, у меня никаких изменений не происходит, какое было, такое и осталось)

pulse · 12 Ноя 2017

ThePhoenix, попробуй Reload в окне) может поможет.

ThePhoenix · 12 Ноя 2017

niiaziev, да без разницы, хоть перезайду, хоть карту поменяю. Если вы думаете, что мой способ неправильный, то когда я меняю картинку, то всё обновляется не выходя с сервера, просто нажатием таба, так что ;)

Tranquillity · 12 Ноя 2017

ThePhoenix, margin-top: -5px;

ThePhoenix · 12 Ноя 2017

Tranquillity,

Это если вместе с margin: 0;
Если без тогда ещё по бокам белые полосы)

12 Ноя 2017

Tranquillity, Получается, если юзать ваш код, тогда полоска сверху уходит вниз ( псс так кстати красивее :D )

Tranquillity · 12 Ноя 2017

ThePhoenix, можно еще попробовать вывести изображение через background-image и задать ему background-size: cover; или background-size: contain;

Sonyx · 12 Ноя 2017

а пропорции у картинки изменить немного уже не вариант?)) нужно всего лишь сделать один из вариантов:
1. обрезать немного по бокам
2. увеличить высоту