Переход по якорю на странице - ломается верстка

[Светлана Г.]

Здравствуйте!

Страница: http://www.salon-kristyle.ru/nogtevoj-servis/ отображается нормально. Но как только переходим по якорю "Ногтевой сервис для мужчин" - верстка ломается, т.е. появляется очень большое вертикальное пространство между футером и контентом, а также невозможно полностью до начала прокрутить эту страницу. 

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

Заранее спасибо!

 

[Vlad02]

у вас для id="wrContent"  position: absolute и bottom:-2000px. или для чего оно задано?

[Bassline]

Проще контент и футер поместить в один общий контейнер, и уже на этот контейнер повесить полупрозрачность, чем городить абсолютный псевдоэлемент с -2000px смещением вниз.

[Светлана Г.]

у вас для id="wrContent"  position: absolute и bottom:-2000px. или для чего оно задано?

 

Это такой способ мне предложили здесь на форуме, чтобы полупрозрачный фон страницы тянулся до низа и имел промежуток под шапкой.

Проще контент и футер поместить в один общий контейнер, и уже на этот контейнер повесить полупрозрачность, чем городить абсолютный псевдоэлемент с -2000px смещением вниз.

 

Была еще задача прижать футер к низу - поэтому вот такое нашли решение.

Выложила это решение здесь: http://jsfiddle.net/SvetaGr/6eatH/

Может быть подправите?

Edited February 25, 2014 by Светлана Г.

[Switch74]

есть способы прижатия футера засунув его в main например через absolute на данном сайте вроде была куча способов

[gare4ka]

https://gist.github.com/barryvdh/2881758

 

Пару переменных ручками на css написать только

[Светлана Г.]

https://gist.github.com/barryvdh/2881758

 

Пару переменных ручками на css написать только

Это пример с прижатым футером?

[Switch74]

вот пример с прижатым футером

[Bassline]

Что-то вроде этого http://jsfiddle.net/6eatH/2/

[Switch74]

да, что-то вроде

[Светлана Г.]

Что-то вроде этого http://jsfiddle.net/6eatH/2/

 

Вот этот вариант работает. Спасибо огромное!

Только при первой загрузке сначала появляется фоновый цвет, а потом все остальное. Тяжеловата картинка?

Edited February 25, 2014 by Светлана Г.

[Светлана Г.]

И еще для .l-header:after нужно добавить left:0; А то блок начинается не от края, а от содержимого .l-header.

[Светлана Г.]

При тестировании в IE8 выявилась проблема - нет вертикальной прокрутки. В виртуалке - нет прокрутки. А в хостовой машине в IE8 - все нормально. Посмотрите, как у вас?

http://www.salon-kristyle.ru/nogtevoj-servis/ - вот здесь.

Edited February 26, 2014 by Светлана Г.

[Светлана Г.]

Никто не подскажет, как вернуть прокрутку в IE8?

[Светлана Г.]

Кажется, нашла причину отсутствия прокрутки.

Вот этот фильтр:

 

.bg3 {    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader( src='bg3.jpg', sizingMethod='scale' )";}