Skip to main content

How to declare more deeper sub-element with > combinator selector?

.component > .parent-element > .elementThe selector you want to insertThe element you want to style

See example​

.btn > .wrapper > .iconThe selector you want to insertThe element you want to style
+component('.btn')
  +register
    +element('> .wrapper')
      +element('> .icon')

  display: inline-flex
  background-color: grey

  +_____________________
  +element('> .wrapper')
    display: inline-block
    position: relative

    +_____________________
    +element('> .icon')
      position: absolute





.btn {
  display: inline-flex;
  background-color: grey;
}

.btn > .wrapper {
  display: inline-block;
  position: relative;
}

.btn > .wrapper > .icon {
  position: absolute;
}

More info: +element, +register, +component, separator +___