Перейти из форума на сайт.

Новости • Файловые архивы
Поиск • Активные темы • Топ лист
Правила • Кто в on-line?
Вход • Забыли пароль? • Первый раз на этом сайте? • Регистрация
Компьютерный форум Ru.Board » Интернет » Web-программирование » Как растянуть фон

Модерирует : Cheery

 Версия для печати • Подписаться • Добавить в закладки

Открыть новую тему     Написать ответ в эту тему

Botovskiu

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Здравствуйте возникла проблема, нужно что бы фон растягивался с лева, что бы был до самого низа.
 
На картинке видно с правой стороны новостные блоки.
С лева блок где меню и фон задний там другой, он не растягивается и в конце блока пробел.
 
скрин: http://pixs.ru/showimage/Bezimya544_2533948_9710551.jpg
 
css блока левого где меню
 
.bleft{
float:left;
margin: -20px;
padding: 20px;
width: 250px;
border-right: 1px solid #BC9A5A;
background: #D8BC84;
}
 
Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 12:28 13-11-2013
xxxZISxxx

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Я так понял что вам нужно растянуть фон меню до самого конца страницы? Не знаю попробуйте протянуть с помощью height:px;.
 
Добавлено:
попробуйте так:
.bleft{  
 float:left;  
 margin: -20px;  
 padding: 20px;  
 width: 250px;  
 height : 100%;
 border-right: 1px solid #BC9A5A;  
 background: #D8BC84;  
 }
Всего записей: 50 | Зарегистр. 14-06-2013 | Отправлено: 16:33 13-11-2013
Botovskiu

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
height : 100%;   пробовал, не работает.
 
да хочу что бы фон был до самого низа.
Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 18:13 13-11-2013
xxxZISxxx

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
у тебя блок внутри блока?
 
Добавлено:
Чтобы растянуть <DIV> на 100% по вертикали для начала прописать для html, body {height: 100%;}. А затем последовательно задать высоту всем родителям данного блока. Обязательно! (Если не обозначить в % высоту всех блоков, в которые вложен требуемый блок, то его высота в процентах будет игнорироваться. )
Всего записей: 50 | Зарегистр. 14-06-2013 | Отправлено: 19:26 13-11-2013
Cheery



.:МордератоР:.		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu
абсолютное позиционирование фонового блока..  
top: 0
bottom: 0

----------
Away/DND
Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 04:05 14-11-2013
Botovskiu

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
Botovskiu
абсолютное позиционирование фонового блока..  
top: 0
bottom: 0

 
это прижать блок, а мне  нужно что бы фон блока растягивался до низу.
Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 05:19 14-11-2013
Cheery



.:МордератоР:.		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu

Цитата:
это прижать блок, а мне  нужно что бы фон блока растягивался до низу

куда прижать?? сделайте другой блок, который будет под вам нужным. его и растяните на полную высоту.  
 
ну или указывайте min-height: 100%;
но там могут быть свои особенности.

----------
Away/DND
Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 05:22 14-11-2013 | Исправлено: Cheery, 05:23 14-11-2013
Botovskiu

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
у тебя блок внутри блока?
 
Добавлено:
Чтобы растянуть <DIV> на 100% по вертикали для начала прописать для html, body {height: 100%;}. А затем последовательно задать высоту всем родителям данного блока. Обязательно! (Если не обозначить в % высоту всех блоков, в которые вложен требуемый блок, то его высота в процентах будет игнорироваться. )

 
вот сайт, http://kjjif.com/main/
 
Добавлено:

Код:
 
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="250" valign="top">
<div class="bleft">
<div style="float: left" id="my_menu" class="sdmenu">
<div>
ЛЕВЫЙ БЛОК С РАЗДЕЛАМИ
</div></div></div>
</td>
<td valign="top" class="bright"><div style="margin-left:-10px; margin-right:-10px">
ПРАВЫЙ БЛОК С ВЫВОДОМ ОСНОВНОЙ ИНФОРМАЦИИ</div></td>
</tr>
</table>
 

 
ВОТ !!!
Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 05:23 14-11-2013
Cheery



.:МордератоР:.		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu
ну я же указал самый простой способ.. добавьте в td position: relative; z-index:0;
 
перед </td>
добавить  
<div style="position: absolute;z-index:0;top: 0px;left: -20px; bottom: -40px; right:-20px; background: #D8BC84;"></div>
и все.. можете, конечно, поиграться и найти растяжение в полную высоту, если не лень
 
вы вообще странно там с margin намудрили, не вижу смысла вырезать "обратно", а потом еще и padding добавлять.

----------
Away/DND
Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 05:43 14-11-2013 | Исправлено: Cheery, 05:44 14-11-2013
Botovskiu

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
да нет не намудрил )
там все просто )
 
это бред вообще какой то все закрывает:
 
<div style="position: absolute;z-index:0;top: 0px;left: -20px; bottom: -40px; right:-20px; background: #D8BC84;"></div>  
 
вставлял сюда:
 
ЛЕВЫЙ БЛОК С РАЗДЕЛАМИ
</div></div></div>
===-сюда-====
</td>
Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 06:12 14-11-2013
Cheery



.:МордератоР:.		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu

Цитата:
это бред вообще какой то все закрывает:

с z-index разберитесь и не будет ничего закрывать.
еще тут  
<div style="float: left;position: relative;z-index: 1;" id="my_menu" class="sdmenu">
 

Цитата:
там все просто )

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

----------
Away/DND
Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 06:23 14-11-2013 | Исправлено: Cheery, 06:27 14-11-2013
Botovskiu

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
наверное я не зря их сделал маргины,  там паддинг идет до этих стилей, отступ внутри полей левого бока и правого ! по этому просто фон сделать не то пальто ! хотя можно переделать все.
 
добавил: style="float: left;position: relative;z-index: 1;"
 
не работает )))  
вы то что придумываете проверяете ?
Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 06:50 14-11-2013
Cheery



.:МордератоР:.		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu

Цитата:
вы то что придумываете проверяете ?

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

----------
Away/DND
Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 06:55 14-11-2013
Botovskiu

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
все переделал ) хотел так сделать но не пробовал )
простое и хорошее решение, но намутил чет ))
Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 06:57 14-11-2013
Cheery



.:МордератоР:.		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu
ваш сайт все равно валидацию не пройдет
пытаетесь использовать XHTML, но при этом используете теги, которые им не поддерживаются.  
не смешивайте xhtml и html5
 

Цитата:
хотел так сделать но не пробовал  

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


----------
Away/DND
Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 07:01 14-11-2013 | Исправлено: Cheery, 07:04 14-11-2013
nicol51

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
del



Для "пробы" есть раздел Тестирование /Cheery/
Всего записей: 806 | Зарегистр. 30-03-2008 | Отправлено: 03:02 10-12-2013 | Исправлено: nicol51, 03:03 10-12-2013
Открыть новую тему     Написать ответ в эту тему

Компьютерный форум Ru.Board » Интернет » Web-программирование » Как растянуть фон


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru