.el:hover > .children {
...
}
.el:hover + .el {
...
}
.card__link:hover .card__overlay
<div class="card">
<div class=card__photo">
<a href="#" class="card__link">Читать дальше</a>
<div class="card__overlay"></div>
</div>
</div>
.card__link:hover + .card__overlay {
...
}
function setMinHeight(items) {
const minHeight = Math.max(...items.map(item => item.offsetHeight));
itemsArr.map(item => item.style.minHeight = minHeight);
}
const itemsArr = Array.from(document.querySelectorAll('общий селектор или селекторы'));
setMinHeight(itemsArr);
.elem {
...
position: relative;
}
.elem::before {
content: '';
display: block;
height: 100%;
padding-top: 100%;
}
const values = [25, 0, 23, 52, 0, 32];
// Константа, дефолтное значение, показывающее максимальную высоту твоих столбиков, в пикселах
const maxHeight = 300;
const getPixelsFromPercents = (val) => (maxHeight * val / 100) + 'px';
// В цикле где-нибудь запустить и убрать первый индекс
const styles = {
height: getPixelsFromPercents(values[0]),
}
// Осталось куда-нить прикрутить что получилось
const values = [25, 0, 23, 52, 0, 32]; // Массив процентов для графика
const maxHeight = 300; // Максимальная высота столбца
const getPixelsFromPercents = (val) => (maxHeight * val / 100) + 'px'; // Функция считающая проценты в пикселах
const labels = Array.from(document.querySelectorAll('.recharts-text.recharts-label')); // Массив столбиков
labels
.map((item, index) = > {
// Каждому столбику присваеваем высоту согласно массиву процентов
item.style.height = getPixelsFromPercents(values[index]);
})
aside {
white-space: nowrap;
}
aside {
display: flex;
width: 80%;
height: 110px;
margin: 10px 0px 30px 10%;
border: 1px ridge Grey;
border-radius: 15px;
overflow-x: scroll;
}
aside img {
height: 100px;
margin-top: 5px;
margin-left: 10px;
border-radius: 10px;
border: 1px solid DimGrey;
}
<table cellpadding="0" cellspacing="0" width="100%" background="img/pattern4.png" style="background-position: 10px center">
<table cellpadding="0" cellspacing="0" style="width:100%;background-image:url(img/pattern4.png);background-position: 10px center;">