Изменить css дива если в него вложен див с нужным css?

Question

[Za Za]

допустим диву с class="col" добавить дисплей инлайн если в нем есть див class="btn"

Comments

[Alex Karo]

Насколько мне известно, это невозможно

[Rustam Bainazarov]

Только через JS пока что.

[Валерий Матвиенко]

Через JS можно сделать. Но это не будет ТРУ способ. Лучше предусмотреть флаговый класс .active на диве с классом .col

[Валерий Матвиенко]

<div class="col">
  <div class="btn">321</div>
</div>

<div class="col">
  <div class="btn btn2">123</div>
</div>

.col {
  margin: 20px;
  border: 2px solid red;
}

.addclass { 
  border: 2px solid green ;
}

.btn {
  display: block;
  width: 100px;
  background: blue;
}

$('.btn2').parent().addClass('addclass');

Как то так.

[Froggyweb]

Интересно было бы увидеть кейс, где это надо.

[Za Za]

Froggyweb, tсть плагин в котором можно прописать классы кастомные - но классы проставляются уже в блоке.
например обзываем инпут как то особенно и такой же инпут2
их всего два и они спокой помечаются в две колонки
но как не верти эти инпуты раставить их в две колонки не выходит - нужно обратиться к классу выше (который стандартыный для всех инпутов (а нужны только нужные, а не все) единственное что их различает и что может прописать пользователь в плагине (с интерфейсом) это нужный класс уже внутри дива для инпута (например кол2/3/5)
понятно что через жс можно - но слишком много в жс нужно учитывать при таком раскладе

Answer 1

[Roman Serdyuk]

В CSS нет возможности обратиться к родительскому элементу из дочернего. То есть блоку .col совершенно плевать, есть в нём .btn или нет. Это можно сделать с помощью javascript/jQuery.
Самый простой вариант - обратиться с помощью .parent() в jQuery либо .parentNode в ванильке.

Comments

[Za Za]

думал раз можно обратиться к соседнему или следующиму, то можно обратиться и к преведущему (((

[Roman Serdyuk]

Михаил Лебедев, нельзя из-за особенностей рендеринга браузером стилей и сдвига элементов. Представьте, если бы вы задали, скажем, ширину дива 100рх, а потом через соседний или дочерний - 1000рх. Это будет сдвиг блока при загрузке. А это плохо.

[Alex Karo]

Вообще, такую штуку уже давно подумывают ввести
https://developer.mozilla.org/ru/docs/Web/CSS/:has
https://bkardell.com/blog/canihas.html

[Roman Serdyuk]

Alex Karo, да, тоже жду, но пока нема. Именно по той причине, по которой я написал - скачок при загрузке страницы.