[3.8.x]

Есть шапка, полноценное изображение, можно как нибудь сделать что бы она не повторялась, а растягивалась при увеличении дисплея? Возможно такое?

Картинке прописать style="width:100%", хотя не помешал бы код шапки для точного ответа.

Лучше делать большую картинку и ставить её на фон

Originally Posted by usrg

Картинке прописать style="width:100%", хотя не помешал бы код шапки для точного ответа.

Скину код чуть позже, у меня проблемка возникла, при заходе в админку сразу же выкидывает из нее.. Вот буду думать что делать, как решу, скину код

xrog добавил 06.08.2013 в 01:06
Гостей очень много, либо брут, либо хттп флуд.
Пробрался я в админку, вот код

<a name="top"></a>
<table border="1px #c33 solid" width="96%" cellpadding="0" cellspacing="0" align="center" style="background: url(ИЗОБРАЖЕНИЕ) repeat-x left bottom;height:205px">

@xrog, мало кода... для вашего варианта нет решения. Сами смотрите - http://htmlbook.ru/css/background-repeat
Вероятно можно переделать с фонового, на фоновое по z-index которое можно массштабировать по другому - мало кода.

Как вариант
Смысл:
Картинка больше чем блок, но видимая часть отображается по размеру блока:
Имеем картинку 200х300, но хочется из нее сделать квадрат в размером 200х200, сохраняя пропорции изображения:

<div class="main_frame">
                <img src="http://www.сайт.com/картинко.jpg" />
</div>

.main_frame {
    height: 500px;  /* <-- этот как бы размер блока, вертикальный */
    overflow: hidden;  /* <-- это самое важное, это спрячет излишки картинки */
    width: 500px;  /* <--  этот как бы размер блока, горизонтальный, ширина */
    border: 1px solid;  /* <--  рамочка, совершенно не принципиальный элемент */
}
.main_frame img {
    margin-top: -5%; /* <-- этим можно поиграться, поставив картинку по вертикали, по центру */
}

Originally Posted by ikopylov

Имеем картинку 200х300, но хочется из нее сделать квадрат в размером 200х200, сохраняя пропорции изображения

У ТС картинка МЕНЬШЕ чем "блок"...тут только делать картинку больше по размеру

Originally Posted by Sven

У ТС картинка МЕНЬШЕ чем "блок"...тут только делать картинку больше по размеру

Необязательно - вполне может быть вся таблица шапки ТС, которую он пока не выложил, заменяется одним img с width:100%, что отлично отресайзится практически любым браузером.

@Sven, а кто мешает растянуть картинку на 100%

.main_frame img {
    margin-top: -5%;
    width: 100%;
}

Если картинка квадратная - будет убого выглядеть.
Лучше делать большую шапку.