Перейти к содержимому

Сервис обмена электронных валют

Партнерская программа Kredov

Repeat картинки фона по "y" в вертикальном сайт баре

#1 Kdes70

Kdes70
  • Пользователь
  • 55 сообщений
  • Репутация: 0
0

Отправлено 27 Февраль 2012 - 21:47

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

Прикрепленные изображения

  • Без-имени-1.jpg

 

 

  • 0

#2 matroskin8

matroskin8
  • Пользователь PRO
  • 767 сообщений
  • Репутация: 143

Отправлено 27 Февраль 2012 - 22:25

Здравствуйте! задумал в вертикальном сайт баре растиражировать картинку горизонтальную, но тиражируется она только в заданном размере

Что-то делаете не так. Фоновое изображение по умолчанию занимает всю доступную область блока. Например:
<style type="text/css">
	.sidebar{
		width:200px;
		border:1px solid #ccc;
		background:url(bg.jpg);
	}
</style>
<div class="sidebar">
Здравствуйте! задумал в вертикальном сайт баре растиражировать картинку горизонтальную, но тиражируется она только в заданном размере. можно ли сделать так что бы она тиражировалось по высоте всего блока, просто высота может меняться
вот на рисунке видно если понадобится выложу стили.
Зарания благодарю за любую оказанную помощь
</div>
В качестве фонового изображения использована картинка 10*10 пикселей.
Результат:

Прикрепленные изображения

  • bg-repeat.jpg

  • 0


#3 Kdes70

Kdes70
    Topic Starter
  • Пользователь
  • 55 сообщений
  • Репутация: 0

Отправлено 27 Февраль 2012 - 22:36

попробовал задать блоку с картинкой высоту 100% вот что получилось
знакомые мне манипуляции с css не дали результатов помогите люди добрые ...

/*левый блок*/

#left{

width: 157px;
height: 100%;

float: left;
outline: 1px solid blue;


}

#title{
height: 40px;
background-image:url("../images/title1.png") ;
background-repeat: no-repeat;
outline: 0px solid red;


}


#nav {
height: 100%;
padding: 8px;
padding-bottom: 0px;
background-image:url("../images/leftfooter.png") ;
background-repeat: repeat-y;
outline: 1px solid red;
}

В качестве фонового изображения использована картинка 10*10 пикселей.


но у меня изображение двух цветное и я зделал полоску 10*150px

Прикрепленные изображения

  • Без-имени-1.jpg

  • 0

#4 matroskin8

matroskin8
  • Пользователь PRO
  • 767 сообщений
  • Репутация: 143

Отправлено 27 Февраль 2012 - 22:48

но у меня изображение двух цветное и я зделал полоску 10*150px

Да хоть трехцветное :blink:
Изображение по умолчанию репитится по всему блоку. Делаете в данном случае полоску шириной 150 и высотой пару пикселей - и картинка будет повторяться до самого низа блока.
<style type="text/css">
	.sidebar{
		width:150px;
		background:url(bg.jpg);
	}
	.sidebar p{
		padding:10px;
	}
</style>
<div class="sidebar">
<p>Здравствуйте! задумал в вертикальном сайт баре растиражировать картинку горизонтальную, но тиражируется она только в заданном размере. можно ли сделать так что бы она тиражировалось по высоте всего блока, просто высота может меняться
вот на рисунке видно если понадобится выложу стили.
Зарания благодарю за любую оказанную помощь</p>
</div>
Результат:

Прикрепленные изображения

  • bg_repeat2.jpg

  • 0


#5 Kdes70

Kdes70
    Topic Starter
  • Пользователь
  • 55 сообщений
  • Репутация: 0

Отправлено 27 Февраль 2012 - 23:16

Но мне нужно чтобы он репился не от содержимого

.sidebar{
width:150px;
background:url(bg.jpg);
от этого он прижемается к навигации, мне нужно что бы он просто репился до футера

Прикрепленные изображения

  • Без-имени-2.jpg

  • 0

#6 yury

yury
  • Пользователь
  • 629 сообщений
  • Репутация: 176

Отправлено 27 Февраль 2012 - 23:21

Здравствуйте! задумал в вертикальном сайт баре растиражировать картинку горизонтальную, но тиражируется она только в заданном размере. можно ли сделать так что бы она тиражировалось по высоте всего блока, просто высота может меняться

Kdes70,
содержимое не пробовали в блок положить? Попробуйте и все у вас "растиражируется".
Или высоту задайте явно, какую вам надо (не в процентах, а в пикселях).
А вообще, судя по вашей задаче, вам полезно будет почитать вот эту статью Колонки одинаковой высоты
  • 0

#7 matroskin8

matroskin8
  • Пользователь PRO
  • 767 сообщений
  • Репутация: 143

Отправлено 27 Февраль 2012 - 23:22

можно ли сделать так что бы она тиражировалось по высоте всего блока, просто высота может меняться

Но мне нужно чтобы он репился не от содержимого

Так что именно нужно? Еще раз повторюсь - фоновое изображение заполняет весь блок. Нужно, чтобы заполнило весь блок? Укажи высоту блока. Определись, что нужно и четко сформулируй вопрос - здесь мысли не читают.
  • 0


#8 Kdes70

Kdes70
    Topic Starter
  • Пользователь
  • 55 сообщений
  • Репутация: 0

Отправлено 27 Февраль 2012 - 23:31

Без-имени-2.jpg надо чтобы фон в сайт баре растягивался в месте с контентом
  • 0

#9 matroskin8

matroskin8
  • Пользователь PRO
  • 767 сообщений
  • Репутация: 143

Отправлено 27 Февраль 2012 - 23:40

Наконец-то...
И опять-таки вопрос сформулирован неверно. Надо чтобы тянулся не фон, а блоки. При этом все блоки должны иметь одинаковую высоту. Улавливаешь разницу? Если будут тянуться блоки, то с ними растянется и фон. А фон и так тянется по всей высоте блока... задай границы блоку, чтобы убедиться в этом.
Для того, чтобы получить решение, достаточно загуглить фразу "блоки одинаковой высоты". Первый же результат предлагает сразу 4 варианта решения.
  • 0


robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85


Оформление форума – IPBSkins.ru