Алексей Бурлака

Не последнем скриншоте нет кода, отвечающего за вывод этого свойства (да и вообще какого-нибудь из свойств).

Там есть закомментированный print_r. Если его раскомментировать, свойство видно в дереве?
Если нет — кеш чистили?
Если чистили и нет, попробуйте не ovchinnokov:компонент, а стандартный, битриксовский.

В слайдере прописаны именно такие id?

урок1

Я так верстаю. Всё в процентах, от шрифта до отступов.
По поводу высоты: как правило такой момент только с картинками, ими и балансирую, иногда вплоть до того, что готовлю пропорциональную прозрачную болванку, которая «держит» мне блок.
Первый сайт был так сверстан лет 5 назад. Пример: www.dovidka.org Это один из моих личных сайтов, на нём и отрывался, когда пришла идея так сверстать.

Потом практика показала, что такая заморочка отлично прокачивает терпение (нужно же замерять и переводить в проценты каждый параметр), но не всегда оправдана.
Иногда лучше (именно лучше, а не проще) задать фикс (или ступеньку фиксов через media-query), который отлично смотрится и на большом экране и на мобильном.

В общем, нужно перед вёрсткой за-Дзениться в макет, определить всё, что не потребует резины и тогда уже анализировать остальное. То есть во главе to-do разработка каркаса, но это как нулевой пункт списка, чтобы сэкономить усилия. Редко когда сайт как сделали так он года в таком виде и живёт. Если он (спасибо, что...) живой, на нём постоянно что-то пилится и нужно заранее подумать о том, как это всё поддерживать: первый макет (в виде чистого PSD) как-правило тает в летах, дизайн-доработки — это скриншоты, в которых перерисована только какая-то область и через год никто уже и не вспомнит, а какая была исходная ширина и относительно чего считать проценты?

Пример с рабочего проекта.

@keyframes obj_noising {
  0% { transform: rotate(2deg) translate( -3px, 0 ); }
  3% { transform: rotate(1deg) translate( 0, 0 );}
  6% { transform: rotate(-1deg) translate( -3px, 0 ); }
  9% { transform: rotate(-2deg) translate( 3px, 0 ); }
  12% { transform: rotate(0deg) translate( -3px, 0 ); }
  15% { transform: rotate(1deg) translate( 0, 0 ); }
  18% { transform: rotate(-1deg) translate( -5px, 0 ); }
  21% { transform: rotate(0deg) translate( 0, 0 ); }
  24% { transform: rotate(2deg) translate( -1px, 0 ); }
  27% { transform: rotate(-1deg) translate( 3px, 0 ); }
  30% { transform: rotate(0deg) translate( 0, 0 ); }
  
  64% { transform: rotate(2deg) translate( -1px, 0 ); }
  67% { transform: rotate(-1deg) translate( 3px, 0 ); }
  70% { transform: rotate(0deg) translate( 0, 0 ); }
}

@-webkit-keyframes obj_noising {
  0% { -webkit-transform: rotate(2deg) translate( -3px, 0 ); }
  3% { -webkit-transform: rotate(1deg) translate( 0, 0 );}
  6% { -webkit-transform: rotate(-1deg) translate( -3px, 0 ); }
  9% { -webkit-transform: rotate(-2deg) translate( 3px, 0 ); }
  12% { -webkit-transform: rotate(0deg) translate( -3px, 0 ); }
  15% { -webkit-transform: rotate(1deg) translate( 0, 0 ); }
  18% { -webkit-transform: rotate(-1deg) translate( -5px, 0 ); }
  21% { -webkit-transform: rotate(0deg) translate( 0, 0 ); }
  24% { -webkit-transform: rotate(2deg) translate( -1px, 0 ); }
  27% { -webkit-transform: rotate(-1deg) translate( 3px, 0 ); }
  30% { -webkit-transform: rotate(0deg) translate( 0, 0 ); }
  
  64% { -webkit-transform: rotate(2deg) translate( -1px, 0 ); }
  67% { -webkit-transform: rotate(-1deg) translate( 3px, 0 ); }
  70% { -webkit-transform: rotate(0deg) translate( 0, 0 ); }
}
@-moz-keyframes obj_noising {
  0% { -moz-transform: rotate(2deg) translate( -3px, 0 ); }
  3% { -moz-transform: rotate(1deg) translate( 0, 0 );}
  6% { -moz-transform: rotate(-1deg) translate( -3px, 0 ); }
  9% { -moz-transform: rotate(-2deg) translate( 3px, 0 ); }
  12% { -moz-transform: rotate(0deg) translate( -3px, 0 ); }
  15% { -moz-transform: rotate(1deg) translate( 0, 0 ); }
  18% { -moz-transform: rotate(-1deg) translate( -5px, 0 ); }
  21% { -moz-transform: rotate(0deg) translate( 0, 0 ); }
  24% { -moz-transform: rotate(2deg) translate( -1px, 0 ); }
  27% { -moz-transform: rotate(-1deg) translate( 3px, 0 ); }
  30% { -moz-transform: rotate(0deg) translate( 0, 0 ); }
  
  64% { -moz-transform: rotate(2deg) translate( -1px, 0 ); }
  67% { -moz-transform: rotate(-1deg) translate( 3px, 0 ); }
  70% { -moz-transform: rotate(0deg) translate( 0, 0 ); }
}
@-o-keyframes obj_noising {
  0% { -o-transform: rotate(2deg) translate( -3px, 0 ); }
  3% { -o-transform: rotate(1deg) translate( 0, 0 );}
  6% { -o-transform: rotate(-1deg) translate( -3px, 0 ); }
  9% { -o-transform: rotate(-2deg) translate( 3px, 0 ); }
  12% { -o-transform: rotate(0deg) translate( -3px, 0 ); }
  15% { -o-transform: rotate(1deg) translate( 0, 0 ); }
  18% { -o-transform: rotate(-1deg) translate( -5px, 0 ); }
  21% { -o-transform: rotate(0deg) translate( 0, 0 ); }
  24% { -o-transform: rotate(2deg) translate( -1px, 0 ); }
  27% { -o-transform: rotate(-1deg) translate( 3px, 0 ); }
  30% { -o-transform: rotate(0deg) translate( 0, 0 ); }
  
  64% { -o-transform: rotate(2deg) translate( -1px, 0 ); }
  67% { -o-transform: rotate(-1deg) translate( 3px, 0 ); }
  70% { -o-transform: rotate(0deg) translate( 0, 0 ); }
}


.f_noising {  
	-webkit-animation:	obj_noising 1.0s infinite; /* Safari 4+ */
	-moz-animation:	obj_noising 1.0s infinite; /* Fx 5+ */
	-o-animation:	obj_noising 1.0s infinite; /* Opera 12+ */
	animation:	obj_noising 1.0s infinite; /* IE 10+, Fx 29+ */
	display: inline-block;
}