nav, так почему же класс active должен добавиться к элементу с классом nav__link?<div id="wrap">
<div class="nav">
<a href="http://test.test/test.html" class="nav__link">LINK</a>
<a href="" class="nav__link">LINK</a>
<a href="" class="nav__link">LINK</a>
<a href="" class="nav__link">LINK</a>
</div>
</div>$(function () {
var loc = window.location.href;
$('.nav__link').each(function () {
var theHref = $(this).attr('href');
if (theHref === loc) {
$(this).addClass('active');
}
});
});background-border дать position: relative, внутри создать абсолютно позиционированный псевдоэлемент на z-index: 1 со всеми стилями, которые сейчас используются для самого background-border. Это позволит не плодить блоки явно, а справиться только средствами css.
html,
body {
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-text-size-adjust: none;
-webkit-overflow-scrolling: touch;
}
* {
backface-visibility: hidden;
// не забывай в дальнейшем отменять данное свойство для конкретных блоков, если нужно видеть обратную сторону при трансформациях.
}max-content не получится, будет занимать все доступное пространство. Необходимо все же указать максимально допустимую ширину:
img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: зависит от задачи, по умолчанию центр.
}.middle-block {
flex: 1 1 auto;
// или, если там иные задачи
flex: 1 1 100%;
}overflow: hidden;, а если нужна прокрутка внутри блока, то лучше уже в него вставить дополнительный контейнер с высотой 100%, которому уже задать overflow: auto;
.promo {
height: 800px;
background: url('../icons/Layer_2.png') center center/cover no-repeat;
}initial может помочь.@media screen and (max-width: 600px) {
div {
width: initial;
}
}mix-blend-mode, прямо-таки фотошоп в браузере. Можно использовать его.