"Резиновая" шапка сайта.

[Forvator]

На данный момент имеется шапка сайта, вставленная обычной картинкой с параметрами:

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

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

 

[Nei]

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

P.S. И реализовывать резину, присваивая width=100% картинке, - это жесть полная))

 

[Dzimarek]

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

 

[darth]

изначально в цсс тебе нада задать ширину бади 100% далее диву ширину 100%.ширина в 100% у картинки будет нормально смотрется только если она изначально у тебя в 1 пиксель) в противном случае скорее всего лучше будет пользоваться бэкграундом

 

[Phrack]

да никак пожалуй нормально не сделаешь, только бекграундом

 

[bork75]

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

<div style="width:100%; height:100; background: url(picture/header.JPG") top left repeat-x; "> </div>

repeat-x; - повторяем по горизонтали
repeat-y; - повторяем по вертикали
no-repeat - не повторять
top left - выравниваем по верхнему левому краю

Т.к. div пустой, то ширину и высоту обязательно нужно задать.

 

[Forvator]

Это весь код, которым вставляется картинка шапки. Это не однородный тон, а обычная картинка с нарисованными на ней людьми размером 1600*290. Параметр height:auto позволяет автоматически подгонять под всю ширину браузера на мониторах с различным разрешением экрана. Например, если сайт открывается на мониторе с разрешением 1024*768, то такая картинка будет автоматически подогнана в масштаб 1 007px × 183px по всей ширене браузера.

 

[Phrack]

попробуй

width:100%;
height:auto;
min-height:183px;
overflow:hidden;

не думаю что будет очень хорошо работать

 

[bork75]

А, понятно. Речь о масштабируемом изображении.
Если просто хочешь избавиться от таблицы, то так

<div style="width:100%; height:100%;">
  <img src="picture/header.JPG" width="100%">
</div>

Если хочешь масштабировать background css, то столкнёшься с проблемой кросбраузерности, придётся хаки вставлять.

можешь ещё по теме посмотреть:

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

ps: А вообще не советую масштабирование использовать, качество будет размытое.

 

[Blooodrinker]

ну нужно ориентироваться на более популярное разрешение экранов и от него отталкиваться.

min-height:183px;

это к чему? не понял... и почему именно 183 пикселя