Помогите с CSS

Блог им. dedmixei
Прошу подсказать по верстке CSS.

Не могу зарепитить фоновую картинку. Посмотрите пож...Njournal

Ситуация такая, блок wrapper в котором располагаются content и sidebar, с двух сторон от wrapper поставил два блока в которых во вертикали надо растянуть фон рамки, но дело в том что фон появляется если только я явно указываю высоту этих блоков (но статическая высота как то в мои планы не входит), если же указываю в CSS высоту 100% или auto, то блоки не появляются.

помогите пожалуста, а то уже голову сломал.

9 комментариев

avatar 
repeat-y;
вам в помощь, а вообще: livestreet.ru/blog/1524.html
avatar
дело в том, что repeat-y у меня прописано само собой (могли бы уж тогда глянуть через фаербаг) проблема в том, как связать высоту блока wrapper и моих боковых блоков.

P.S. А поиском пользоваться умею…
avatar
Вам не нужны дополнительные блоки, сделайте одну фоновую картинку для #wrapper, коли он у вас фиксированной ширины, и пусть повторяется по вертикали.
avatar
нужно все аспекты проблемы описывать. у wrapper пробовали бэкграунд с репитом по оси y сделать, а блоки контент и сайдбар через паддинг поправить? естественно, все это без созданных дополнительных блоков.
avatar
решили проблему? Нифига из топика не понял, но по идее решение может быть такое. Для враппер задаём фон с репит-y с привязкой к левой стороне. Внутрь враппера ещё один слой со свойствами фона репит-у и привязкой к правой стороне. А по-идее оптимально, как уже и написали. Раз ширина фиксированная — использовать для враппера один = ширине враппера фон с репит-у.
avatar
Спасибо за помощь. Сделал для фона изображение 1000*5px и поставил его фоном для wrapper c repeat-y, просто изначально думал полурезиновым шаблон сделать, сделаю фиксированную ширину (так шаблон гораздо легче сделать будет)
avatar
вот мне интересно просто, вот кто заминусовал? такое ощущение что спросить ничего нельзя
avatar
Прошу помощи.Хочу воткнуть горизонтальное меню
<ul id="navigationMenu">
	<li>
		<a class="home" href="#">
			<span>{$aLang.topic_title}</span>
		</a>
	</li>
	<li>
		<a class="about" href="#">
			<span>{$aLang.topic_title}</span>
		</a>
	</li>
	<li>
		<a class="services" href="#">
			<span>{$aLang.topic_title}</span>
		</a>
	</li>
	<li>
		<a class="portfolio" href="#">
			<span>{$aLang.topic_title}</span>
		</a>
	</li>
	<li>
		<a class="contact" href="#">
			<span>{$aLang.topic_title}</span>
		</a>
	</li>
</ul>


И прикручиваю CSS (добавляю в файл navs.css)

* {
	margin:0;
	padding:0;
	}
#navigationMenu li {
	list-style:none;
	height:39px;
	padding:2px;
	width:40px;
	}
#navigationMenu span {
	width: 0;
	left: 38px;
	padding: 0;
	position: absolute;
	overflow: hidden;
	font-family: 'Myriad Pro',Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 0.6px;
	white-space: nowrap;
	line-height: 39px;
	-webkit-transition: 0.25s;
	-moz-transition: 0.25s;
	transition: 0.25s;
	}
#navigationMenu a {
	background: url('navigation.jpg') no-repeat;
	height: 39px;
	width: 38px;
	display: block;
	position: relative;
	text-decoration: none;
	}
#navigationMenu a:hover span {
	width :auto;
	padding: 0 20px;
	overflow: visible;.
	text-decoration: none;
	}
#navigationMenu a:hover {
	text-decoration: none;
	-moz-box-shadow: 0 0 5px #9ddff5;
	-webkit-box-shadow: 0 0 5px #9ddff5;
	box-shadow: 0 0 5px #9ddff5;
	}

/* Зелёная кнопка */

#navigationMenu .home {
	background-position: 0 0;
	}
#navigationMenu .home:hover {
	background-position: 0 -39px;
	}
#navigationMenu .home span {
	background-color: #7da315;
	color: #3d4f0c;
	text-shadow: 1px 1px 0 #99bf31;
	}

/* Голубая кнопка */

#navigationMenu .about {
	background-position: -38px 0;
	}
#navigationMenu .about:hover {
	background-position: -38px -39px;
	}
#navigationMenu .about span {
	background-color: #1e8bb4;
	color: #223a44;
	text-shadow: 1px 1px 0 #44a8d0;
	}

/* Оранжевая кнопка */

#navigationMenu .services {
	background-position: -76px 0;
	}
#navigationMenu .services:hover {
	background-position: -76px -39px;
	}
#navigationMenu .services span {
	background-color: #c86c1f;
	color: #5a3517;
	text-shadow: 1px 1px 0 #d28344;
	}

/* Желтая кнопка */

#navigationMenu .portfolio {
	background-position: -114px 0;
	}
#navigationMenu .portfolio:hover {
	background-position: -114px -39px;
	}
#navigationMenu .portfolio span {
	background-color: #d0a525;
	color: #604e18;
	text-shadow: 1px 1px 0 #d8b54b;
	}

/* Пурпурная кнопка */

#navigationMenu .contact {
	background-position: -152px 0;
	}
#navigationMenu .contact:hover {
	background-position: -152px -39px;
	}
#navigationMenu .contact span {
	background-color: #af1e83;
	color: #460f35;
	text-shadow: 1px 1px 0 #d244a6;
	}


CSS к меню не прикручивается, что я делаю не так?
Вместо # и точку ставил, если вставляю в отдельном хтмл в хедер всё работает.
avatar
Картинку так пишу
(../images/navigation.jpg)
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.