# How to create descendant selector?

**URL:** <https://forum.pinegrow.com/t/how-to-create-descendant-selector/3527>\
**Category:** Beginners\
**Created:** [November 17, 2019, 6:02pm UTC](https://forum.pinegrow.com/t/how-to-create-descendant-selector/3527 "2019-11-17T18:02:18Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![pashkatarakashka](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/pashkatarakashka/32/2311_2.png) [@pashkatarakashka](https://forum.pinegrow.com/u/pashkatarakashka)\
**Post date:** [November 17, 2019, 6:02pm UTC](https://forum.pinegrow.com/t/how-to-create-descendant-selector/3527/1 "2019-11-17T18:02:18Z")

</div>

How can I create descendant selector in CSS stylesheet?  
This is what I need.

```
.float-container {
  border: solid 1px #ccc;
  position: relative;
}
.float-container input {
  border: none;
  outline: 0;
}

```

When I go to Add class and write `.float-container input` in the box, Pinegrow just adding them into an element as class names.  
I also tried directly writing selectors into css file, but in inspector panel I don’t see both selector, but only the first one. Does it mean Pinegrow does not support working with descendant selectors?

---

<div class="post-metadata">

**Author:** ![red-rosefields](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/red-rosefields/32/5392_2.png) [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\
**Post date:** [November 17, 2019, 8:09pm UTC](https://forum.pinegrow.com/t/how-to-create-descendant-selector/3527/2 "2019-11-17T20:09:05Z")

</div>

> [@The ACTIVE tab should account for combinator selectors and all available pseudo state toggles](https://forum.pinegrow.com/t/the-active-tab-should-account-for-combinator-selectors-and-all-available-pseudo-state-toggles/3492):
>
> currently PG does not show as “ACTIVE” the CSS rules that apply via combinators like descendant selectors, ~, \> or the + also please add new pseudo state toggles to the ACTIVE tab as they become standard, such as the :checked :pseudo state Continuing the discussion from [The Styles | ACTIVE tab – pseudo state toggles](https://forum.pinegrow.com/t/the-styles-active-tab-pseudo-state-toggles/3425/11):

It seems not. Give the feature request a plus 1.,

---

<div class="post-metadata">

**Author:** ![droidgoo](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/droidgoo/32/2209_2.png) [@droidgoo](https://forum.pinegrow.com/u/droidgoo)\
**Post date:** [November 18, 2019, 3:30pm UTC](https://forum.pinegrow.com/t/how-to-create-descendant-selector/3527/3 "2019-11-18T15:30:38Z")

</div>

to clarify, PG does use the selectors properly and fully supports the CSS3 standard in how it renders and behaves.

what’s missing is the same level of GUI access for these things as PG currently has for single selectors in the styles and active tabs.

if you use combinators in your CSS it will show under the styles.css tab and you can edit it there, but it will not show up in the ACTIVE tab as it should.

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [November 18, 2019, 4:05pm UTC](https://forum.pinegrow.com/t/how-to-create-descendant-selector/3527/4 "2019-11-18T16:05:40Z")

</div>

For me it works as expected.  
I select the input element from the tree.  
From the styling “Active” tab I put “.float-container input” into the box and click “Create”  
Now under the “Style attribute” dropdown I can select that rule.  
 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/9/92956466c9acbca022a38f125f84498d0ebc1211.png)  
I can then go to the visual editor and add rules  
 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/a/a975c90ad2df9f449210c7d851110540c01c1865.png)  
Changing the tree element to the float container makes the attribute go away, switching back to the input makes it appear

This is the same for the child combinator - create the selector anywhere in your tree - when you select an element in the tree that matches the rule you can use the visual styling

---

<div class="post-metadata">

**Author:** ![droidgoo](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/droidgoo/32/2209_2.png) [@droidgoo](https://forum.pinegrow.com/u/droidgoo)\
**Post date:** [November 18, 2019, 10:41pm UTC](https://forum.pinegrow.com/t/how-to-create-descendant-selector/3527/5 "2019-11-18T22:41:25Z")

</div>

i stand corrected.

i thought i checked this when i upgraded to 5.8 and it was still not working, but it seems to work now. yea team!

now if i could still get that :checked pseudo state included in there with the rest of them on the ACTIVE tab 😉