Как сделать image на все окно браузера?

[Feel]

Вставил картинку через "<img></img>" на страницу, но она не захотела располагаться от левого верхнего пиксела страницы. Получился зазор. Скрин ниже:

Подскажите, как можно это исправить?

Дополнительный вопрос:

Существует много сайтов, где нет необходимости скроллить - все умещается в рамки одного экрана, причем не видно чтобы фоновый рисунок, который является цельным, а не размноженной текстурой и.т.п., увеличивался при просмотре на большом мониторе.

Например:

http://www.thewildernessdowntown.com/

Подскажите, каким образом этого можно добиться?

[moron]

Получился зазор

Падинги и маргины обнули в боди, хтмл и катинки.

Edited July 22, 2012 by moron

[Feel]

Получился зазор

Падинги и маргины обнули в боди, хтмл и катинки.

Помогло, спасибо.

Что насчет второго вопроса?

Edited July 22, 2012 by Feel

[moron]

Что насчет второго вопроса?

Если брать тот пример который предложили вы, то посмотрев в стили можно увидеть

body{
	background: url(http://cdn.thewildernessdowntown.com//img/pattern.jpg) repeat-x;
	overflow: hidden;
}

Фон сделан одной картинкой повторяющейся по горизонтали. Исчезновение скролла при уменьшение окна нам дает overflow: hidden; . А картинка деревца, в левом верхнем углу не маштабируется взависимости разрешения экрана ( можно проверить ctrl+колесико мыши )

Edited July 22, 2012 by moron

[Feel]

Возникла новая проблема с картинкой. Цель - сделать фон таким же резиновым как на http://www.agnieszkaczarnocka.pl/poczatek.

На данный момент в коде:

<img src="images/wrapper.jpg" width="100%"></img>

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

[Viper]

Возникла новая проблема с картинкой. Цель - сделать фон таким же резиновым как на http://www.agnieszka...ka.pl/poczatek.

Фон на этом сайте не резиновый, так только визуально может показаться.

background: url("../images/background.jpeg") repeat fixed center center #080705;

Он (динамически) центритуеться по центру.

[Feel]

Он (динамически) центритуеться по центру.

Не совсем понял как именно. В центре рисунок, а вокруг залито черным?

[Viper]

Не совсем понял как именно. В центре рисунок, а вокруг залито черным?

В общем, да(было бы без репита). А так он еще и репититься по 2-м направлениям. А эффект "якобы резины" достигаеться благодаря свойству "fixed", которое (всегда) фиксирует центральную часть фона по центру.

[Feel]

На том же сайте текст при изменении высоты браузера движется вверх/вниз. Сколько не делал padding у body в процентах (а именно в нем лежит div-контейнер, которые должен двигаться), по вертикали контейнер не хочет подниматься.

Edited July 22, 2012 by Feel

[Viper]

На том же сайте текст при изменении высоты браузера движется вверх/вниз. Сколько не делал padding у body в процентах (а именно в нем лежит div-контейнер, которые должен двигаться), по вертикали контейнер не хочет подниматься.

задавай padding контейнеру, а не body, хоть проблема может быть и не в этом.

На предоставленном сайте контент абсолютно спозиционирован.

Советую закрыть его и более не открывать - там все(почти) реализованно через Ж.

[Feel]

Советую закрыть его и более не открывать - там все(почти) реализованно через Ж.

А я вот цель поставил себе реализовать тот же дизайн. Но будет классным если я еще не допущу ошибок верстки и юзабилити этого сайта, т.е. сделаю то же, но лучше.

Viper, спаси меня, поделись советом как сделать лучше. Как сделал бы ты, например.

Лично я пока что сделал для себя следующие выводы по верстке:

Верстать нужно резиново, т.к. если будет фиксированная верстка, то подобный сайт будет отображаться узкой полоской на больших мониторах. А так он будет немного растягиваться при увеличении разрешения - что я реализовал при помощи процентного padding.

Слайдбар расположить хочу горизонтально.

Юзать ajax, чтобы менять изображения не перезагружая страницы.

[Viper]

Viper, спаси меня, поделись советом как сделать лучше.

Что именно?)

Как сделал бы ты, например.

По max возможности HTML5/CSS3, Graceful degradation, адаптивную верстку(или какую-то её часть), верстку независимыми блоками, accessibility и повышения доступности сайта, по max оптимизировать клиентскую часть и тд)

Просто старайся делать правильно, что бы пользователям было удобно и комфортно на сайте) Не ставь "фишки" дизайна и понты выше usability: пользователи, при просмотре сайтов, "не должны ждать и думать".

Лично я пока что сделал для себя следующие выводы по верстке:

Верстать нужно резиново, т.к. если будет фиксированная верстка, то подобный сайт будет отображаться узкой полоской на больших мониторах. А так он будет немного растягиваться при увеличении разрешения - что я реализовал при помощи процентного padding.

если контента мало, то резина в общем-то безсмысленна, а вообще все зависит от дизайна и желаний автора...

Юзать ajax, чтобы менять изображения не перезагружая страницы.

Ajax для этого не нужен.

[Feel]

На том же сайте текст при изменении высоты браузера движется вверх/вниз. Сколько не делал padding у body в процентах (а именно в нем лежит div-контейнер, которые должен двигаться), по вертикали контейнер не хочет подниматься.

задавай padding контейнеру, а не body, хоть проблема может быть и не в этом.

На предоставленном сайте контент абсолютно спозиционирован.

Советую закрыть его и более не открывать - там все(почти) реализованно через Ж.

Не помогло.

Объясняю конкретно и подробно что хочу получить:

Есть контейнер <div>. Располагается внутри <body>. Его ширина и высота задана фиксировано. Хочу чтобы при изменении размеров окна браузера (как ширины, так и высоты), он менял свое положение, в соответствии с изменением окна браузера (всегда оставался в зоне видимости и на том же месте, относительно текущего размера окна браузера). Подобное я видел в макетах адаптивной верстки.

Что есть в данный момент:

Css контейнера:

#logo {

width:500px;

margin: auto;

padding-left:-300px;

padding-top:240px;

}

В данный момент контейнер меняет свое положение по горизонтали при изменении размера окна браузера. Здесь все устраивает. Как организовать перемещение по вертикали?