Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Вопрос по бэкграунду.

Автор: Shuman 11.12.2005, 16:47

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

Код

style="background:url(img/bg_right.gif) repeat-y right; "

. И все бы хорошо, только вот нужно чтобы она сшла сверху и до самого низа любого браузера( в смысле размера окна). т.е. чтобы как-то растягивалась. А у меня она остается скажем на высоте 550 пикселей и все. Конечно если я набью страницу текстом на 1800 пикселей в высоту то проблем не будет ни в каких окнах, но будут и очень маленькие странички. Верстаю так: беру общую таблицу с шириной в 100%, разбиваю ее на блоки и уже в них таблицы с остальным контентом. Все marginwith и прочее оттуда поставил по нулям, т.е по идее главная таблица должна занимать все пространство, а она нет. Та же проблема если пустить такую полоску снизу по горизонтали. она повиснет в воздухе. хотелось бы универсально как-то это решить, если возможно.

Автор: 2man 11.12.2005, 19:46

Убери repeat-y right smile

Также я бы тебе посоветовал использовать фон, если у пользователя отключена опция просмотра картинок. А лучше через CSS:

Код


select{
        background: #d4dae8 url(img/bg_right.gif);
        border: 0px solid #010916;
        color: #000;
        font-family: verdana, helvetica, sans-serif;
        font-size: 11px;
        margin: 5px;
        padding: 2px;
        vertical-align: middle;
}

Автор: Shuman 11.12.2005, 20:55

2man
Думаю, что repeat-y right просто незначительное уточнение и оно тут не при чем. Проблема ведь в другом. Нужно сверстать страницу так, чтобы по высоте она была в размер любого окна браузера, чтобы пускать зацикленные полоски по сайту не опасаясь, что на мониторах за 20 дюймов, она не закончится где-нибудь на середине экрана. Создание изображений, скажем,1300 высотой и 17 в ширину для фона тоже не подходит, так как проблема прежде всего в неверной верстке.

Автор: R.M. 12.12.2005, 09:29

2man
Всё что ты написал после background: #d4dae8 url(img/bg_right.gif); вобще тут непричём, зачем пихать лишние строки?

Shuman
Сложно определить со слов, выложи или код или ссылку на страницу, но с твоих слов

Цитата(Shuman @ 11.12.2005, 17:47)

беру общую таблицу с шириной в 100%, разбиваю ее на блоки и уже в них таблицы с остальным контентом. Все marginwith и прочее оттуда поставил по нулям, т.е по идее главная таблица должна занимать все пространство, а она нет.

она и не должна занимать 100% высоты если она 100% шириной, пропиши для <table> высоту height=100%

Автор: Str!pe 12.12.2005, 14:14

Shuman

Код


<table width="100%" height="100%">
<tr>
<td width="100%" height="100%" style="background:url(img/bg_right.gif) repeat-y right">
Ну вот тут весь текст и все такое:) обязательно хоть что то должно быть, хоть пробел...
</td>
</tr>
</table>

2man

Цитата(2man @ 11.12.2005, 19:46)

Убери repeat-y right

Он же хочет одиночную полоску справа выставить! Дак зачем убирать?

Автор: Shuman 12.12.2005, 16:07

Stripe
Ты знаешь и неплохо было бы. Но есть одно мерзкое условие <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> с которым это не пройдет. Избавляться от доктайпа стремно блин как-то. Есть еще способы?
Добавлено @ 16:15
Куксикус
Без доктайпа работает...а с ним не реагируют браузеры на такие изменения( я про высоту = 100)

Автор: dm9 18.12.2005, 14:36

1. Для height 100% под доктайпы читаем здесь:
http://www.quirksmode.org/css/100percheight.html

2.

Цитата(Shuman @ 11.12.2005, 17:47)

style="background:url(img/bg_right.gif) repeat-y right; "

На боди пробовал это ставить, а не на таблицу? У меня работает, например.

Автор: Cheba 18.12.2005, 20:26

dm9, а на xhtml не пробовал? smile

Там, если body маленький, то фон будет только в нем. Один выход - это растягивать body. Но можно менее болезненно - задать фон тегу html. smile

Автор: dm9 18.12.2005, 21:48

Цитата(Cheba @ 18.12.2005, 21:26)

dm9, а на xhtml не пробовал?

Хм...... попробовал.

ИЕ 5, ИЕ 5.5, ИЕ 6.0 (No SP), Firefox 1.0.7, Opera 8.02, Opera 6.0 - это скушали за милую душу. Картинка была PNG. Кто хочет - попробуйте gif и jpeg, мне лениво...

Вот исходник.

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=windows-1251" />
</head>
<body style="background: url(bg.png) repeat-y 100% 0%">
<div class="div_cutwidth">
123<br />
123<br />
123<br />
123<br />
123<br />
</div>
</body>
</html>